Merge pull request #6 from harness/ui-template-improved4

Add typing improvements

web/src/AppProps.ts

@@ -1,6 +1,7 @@
 import type React from 'react'
 import type * as History from 'history'
 import type { PermissionOptionsMenuButtonProps } from 'components/Permissions/PermissionsOptionsMenuButton'
+import type { Unknown } from 'utils/Utils'
 import type { LangLocale } from './framework/strings/languageLoader'
 
 /**
@@ -66,16 +67,16 @@ export interface AppPathProps {
  * Platform integration.
  */
 export interface AppPropsHook {
-  usePermission(permissionRequest: any, deps?: Array<any>): Array<boolean>
-  useGetSchemaYaml(params: any, deps?: Array<any>): Record<string, any>
-  useGetToken(): any
-  useAppStore(): any
-  useGitSyncStore(): any
-  useSaveToGitDialog(props: { onSuccess: any; onClose: any; onProgessOverlayClose: any }): any
-  useGetListOfBranchesWithStatus(props: any): any
+  usePermission(permissionRequest: Unknown, deps?: Array<Unknown>): Array<boolean>
+  useGetSchemaYaml(params: Unknown, deps?: Array<Unknown>): Record<string, Unknown>
+  useGetToken(): Unknown
+  useAppStore(): Unknown
+  useGitSyncStore(): Unknown
+  useSaveToGitDialog(props: { onSuccess: Unknown; onClose: Unknown; onProgessOverlayClose: Unknown }): Unknown
+  useGetListOfBranchesWithStatus(props: Unknown): Unknown
   useAnyEnterpriseLicense(): boolean
   useCurrentEnterpriseLicense(): boolean
-  useLicenseStore(): any
+  useLicenseStore(): Unknown
 } // eslint-disable-line  @typescript-eslint/no-empty-interface
 
 /**
@@ -87,7 +88,7 @@ export interface AppPropsComponent {
   RbacButton: React.FC
   RbacOptionsMenuButton: React.FC<PermissionOptionsMenuButtonProps>
   GitSyncStoreProvider: React.FC
-  GitContextForm: React.FC<any>
+  GitContextForm: React.FC<Unknown>
   NavigationCheck: React.FC<{
     when?: boolean
     textProps?: {

web/src/RouteDestinations.tsx

@@ -6,7 +6,9 @@ import { SignUp } from 'pages/SignUp/SignUp'
 import { routePath } from './RouteUtils'
 import { RoutePath } from './RouteDefinitions'
 
-export const RouteDestinations: React.FC<{ standalone: boolean }> = React.memo(({ standalone }) => {
+export const RouteDestinations: React.FC<{ standalone: boolean }> = React.memo(function RouteDestinations({
+  standalone
+}) {
   const Destinations: React.FC = useCallback(
     () => (
       <Switch>

web/src/components/NameIdDescriptionTags/NameIdDescriptionTags.tsx

@@ -6,6 +6,7 @@ import { Classes, IInputGroupProps, ITagInputProps } from '@blueprintjs/core'
 import cx from 'classnames'
 import type { FormikProps } from 'formik'
 import { useStrings } from 'framework/strings'
+import type { Unknown } from 'utils/Utils'
 import type {
   DescriptionComponentProps,
   DescriptionProps,
@@ -23,7 +24,7 @@ export interface NameIdDescriptionTagsProps {
   tagsProps?: Partial<ITagInputProps> & {
     isOption?: boolean
   }
-  formikProps: FormikProps<any>
+  formikProps: FormikProps<Unknown>
   className?: string
   tooltipProps?: DataTooltipInterface
 }

web/src/components/NameIdDescriptionTags/NameIdDescriptionTagsConstants.ts

@@ -2,6 +2,7 @@ import type { TagInputProps } from '@harness/uicore'
 import type { ITagInputProps, IInputGroupProps } from '@blueprintjs/core'
 import type { InputWithIdentifierProps } from '@harness/uicore/dist/components/InputWithIdentifier/InputWithIdentifier'
 import type { FormikProps } from 'formik'
+import type { Unknown } from 'utils/Utils'
 
 export interface DescriptionProps {
   placeholder?: string
@@ -34,7 +35,7 @@ export interface NameIdDescriptionTagsDeprecatedProps<T> {
   identifierProps?: Omit<InputWithIdentifierProps, 'formik'>
   descriptionProps?: DescriptionProps
   tagInputProps?: TagInputProps<T>
-  formikProps: FormikProps<any>
+  formikProps: FormikProps<Unknown>
   className?: string
 }
 
@@ -43,5 +44,5 @@ export interface NameIdDescriptionProps {
   inputGroupProps?: IInputGroupProps
   descriptionProps?: DescriptionProps
   className?: string
-  formikProps: Omit<FormikProps<any>, 'tags'>
+  formikProps: Omit<FormikProps<Unknown>, 'tags'>
 }

web/src/components/Permissions/PermissionsButton.tsx

@@ -1,9 +1,10 @@
 import React from 'react'
 import { Button, ButtonProps } from '@harness/uicore'
 import { useAppContext } from 'AppContext'
+import type { Unknown } from 'utils/Utils'
 
 interface PermissionButtonProps extends ButtonProps {
-  permission?: any
+  permission?: Unknown
 }
 
 export const PermissionsButton: React.FC<PermissionButtonProps> = (props: PermissionButtonProps) => {

web/src/components/Permissions/PermissionsOptionsMenuButton.tsx

@@ -2,11 +2,12 @@ import React, { AnchorHTMLAttributes, ReactElement } from 'react'
 import type { IMenuItemProps } from '@blueprintjs/core'
 import { OptionsMenuButton, OptionsMenuButtonProps } from 'components/OptionsMenuButton/OptionsMenuButton'
 import { useAppContext } from 'AppContext'
+import type { Unknown } from 'utils/Utils'
 
 type Item = ((IMenuItemProps | PermissionsMenuItemProps) & AnchorHTMLAttributes<HTMLAnchorElement>) | '-'
 
 interface PermissionsMenuItemProps extends IMenuItemProps {
-  permission?: any
+  permission?: Unknown
 }
 
 export interface PermissionOptionsMenuButtonProps extends OptionsMenuButtonProps {

web/src/hooks/useQueryParams.ts

@@ -2,9 +2,10 @@ import React from 'react'
 import { useLocation } from 'react-router-dom'
 import qs from 'qs'
 import type { IParseOptions } from 'qs'
+import type { Unknown } from 'utils/Utils'
 
 export interface UseQueryParamsOptions<T> extends IParseOptions {
-  processQueryParams?(data: any): T
+  processQueryParams?(data: Unknown): T
 }
 
 export function useQueryParams<T = unknown>(options?: UseQueryParamsOptions<T>): T {
@@ -18,7 +19,7 @@ export function useQueryParams<T = unknown>(options?: UseQueryParamsOptions<T>):
     }
 
     return params
-  }, [search, options, options?.processQueryParams])
+  }, [search, options])
 
   return queryParams as unknown as T
 }

web/src/hooks/useStandalonePermission.ts

@@ -1,3 +1,5 @@
-export function useStandalonePermission(_permissionsRequest?: any, _deps: Array<any> = []): Array<boolean> {
+import type { Unknown } from 'utils/Utils'
+
+export function useStandalonePermission(_permissionsRequest?: Unknown, _deps: Array<Unknown> = []): Array<boolean> {
   return [true, true]
 }

web/src/pages/SignIn/SignIn.tsx

@@ -1,4 +1,4 @@
-import { useHistory } from 'react-router-dom'
+// import { useHistory } from 'react-router-dom'
 import React, { useCallback, useState } from 'react'
 // import { get } from 'lodash-es'
 import { Button, Container, Layout, Text, TextInput } from '@harness/uicore'
@@ -9,7 +9,7 @@ import { useOnLogin } from 'services/pm'
 
 export const SignIn: React.FC = () => {
   const { getString } = useStrings()
-  const history = useHistory()
+  // const history = useHistory()
   const [username, setUsername] = useState('')
   const [password, setPassword] = useState('')
   // const [, setToken] = useAPIToken()
@@ -30,7 +30,7 @@ export const SignIn: React.FC = () => {
         // eslint-disable-next-line no-console
         console.error({ error })
       })
-  }, [mutate, username, password, history])
+  }, [mutate, username, password])
 
   return (
     <Layout.Vertical>

web/src/utils/Enums.ts

@@ -1,11 +0,0 @@
-export enum Sort {
-  DESC = 'DESC',
-  ASC = 'ASC'
-}
-
-export enum SortFields {
-  LastUpdatedAt = 'updated',
-  AZ09 = 'AZ09',
-  ZA90 = 'ZA90',
-  Name = 'name'
-}

web/src/utils/Utils.ts

@@ -5,6 +5,8 @@ import moment from 'moment'
 import { useEffect } from 'react'
 import { useAppContext } from 'AppContext'
 
+export type Unknown = any // eslint-disable-line @typescript-eslint/no-explicit-any
+
 /** This utility shows a toaster without being bound to any component.
  * It's useful to show cross-page/component messages */
 export function showToaster(message: string, props?: Partial<IToastProps>): IToaster {
@@ -99,7 +101,7 @@ export const useAnyTrialLicense = (): boolean => {
   return !!anyTrialEntitlements
 }
 
-export const useGetTrialInfo = (): any => {
+export const useGetTrialInfo = (): Unknown => {
   const {
     hooks: { useLicenseStore = () => ({}) }
   } = useAppContext()