Integrate Knip

.github/workflows/lint-and-test.yml

@@ -138,6 +138,45 @@ jobs:
         if: steps.check-scripts.outputs.skip != 'true' && steps.check-scripts.outputs.skip-test != 'true'
         run: cd ${{ matrix.package }} && yarn test
 
+  lint-knip:
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout the PR branch
+        uses: actions/checkout@v2
+
+      - name: Get the base branch
+        id: base_branch
+        run: echo "::set-output name=branch::$(echo '${{ github.base_ref }}' || echo 'main')"
+
+      - name: Checkout base branch
+        uses: actions/checkout@v2
+        with:
+          ref: ${{ steps.base_branch.outputs.branch }}
+      - uses: actions/setup-node@v4
+      - name: Install dependencies
+        run: yarn install --ignore-scripts
+      - name: Run knip on base branch
+        id: knip_base
+        run: |
+          echo "${{ steps.base_branch.outputs.branch }}"
+          OUTPUT=$(yarn knip --no-exit-code --reporter=./knip-reporter.ts)
+          echo "Output: $OUTPUT"
+          JSON=$(echo "$OUTPUT" | grep -o '{.*}')
+          total_issues=$(echo "$JSON" | jq '.totalIssues')
+          echo "Total Issues: $total_issues"
+          echo "::set-output name=maxIssues::$total_issues"
+
+      - name: Checkout the PR branch
+        uses: actions/checkout@v2
+        with:
+          ref: ${{ github.head_ref }}
+      - uses: actions/setup-node@v4
+      - name: Install dependencies
+        run: yarn install --ignore-scripts
+      - name: Run knip on PR branch
+        run: |
+          yarn knip --max-issues=${{ steps.knip_base.outputs.maxIssues }} --reporter=./knip-reporter.ts
+
   security-scans:
     needs: setup
     runs-on: ubuntu-22.04

knip-reporter.ts

@@ -0,0 +1,18 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * OpenCRVS is also distributed under the terms of the Civil Registration
+ * & Healthcare Disclaimer located at http://opencrvs.org/license.
+ *
+ * Copyright (C) The OpenCRVS Authors located at https://github.com/opencrvs/opencrvs-core/blob/master/AUTHORS.
+ */
+import type { Reporter } from 'knip'
+
+const reporter: Reporter = function (options) {
+  const { counters } = options
+  console.log('Total unused exports found with knip:', counters.total)
+}
+
+export default reporter

knip.ts

@@ -0,0 +1,18 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * OpenCRVS is also distributed under the terms of the Civil Registration
+ * & Healthcare Disclaimer located at http://opencrvs.org/license.
+ *
+ * Copyright (C) The OpenCRVS Authors located at https://github.com/opencrvs/opencrvs-core/blob/master/AUTHORS.
+ */
+import type { KnipConfig } from 'knip'
+
+const config: KnipConfig = {
+  entry: ['src/index.ts'],
+  project: ['src/**/*.ts']
+}
+
+export default config

package.json

@@ -37,15 +37,19 @@
     "seed:prod": "NODE_ENV=production lerna run seed --stream --scope @opencrvs/data-seeder",
     "add:license": "license-check-and-add add -f license-config.json",
     "build:components": "lerna run build --scope @opencrvs/components",
-    "debug": "bash debug-service-in-chrome.sh"
+    "debug": "bash debug-service-in-chrome.sh",
+    "knip": "knip"
   },
   "devDependencies": {
     "@types/dotenv": "^6.1.0",
+    "@types/node": "^22.7.9",
     "concurrently": "^8.0.0",
     "husky": "^9.1.6",
+    "knip": "^5.34.0",
     "lerna": "^8.0.0",
     "lint-staged": "^15.2.10",
-    "prettier": "2.8.8"
+    "prettier": "2.8.8",
+    "typescript": "^5.6.3"
   },
   "dependencies": {
     "@types/react-signature-canvas": "^1.0.2",

packages/login/src/App.tsx

@@ -12,7 +12,7 @@ import { PageContainer } from '@login/common/PageContainer'
 import { ErrorBoundary } from '@login/ErrorBoundary'
 import { IntlContainer } from '@login/i18n/components/I18nContainer'
 import * as routes from '@login/navigation/routes'
-import { AppStore, createStore } from '@login/store'
+import { AppStore } from '@login/store'
 import { StepOneContainer } from '@login/views/StepOne/StepOneContainer'
 import { getTheme } from '@opencrvs/components/lib/theme'
 import * as React from 'react'
@@ -32,7 +32,6 @@ import { LoginBackgroundWrapper } from '@login/common/LoginBackgroundWrapper'
 import { StepTwoContainer } from '@login/views/StepTwo/StepTwoContainer'
 import { ReloadModal } from './views/ReloadModal'
 
-export const { store, history } = createStore()
 interface IAppProps {
   store: AppStore
   history: History

packages/login/src/common/LoginBackgroundWrapper.tsx

@@ -55,7 +55,7 @@ export interface IProps {
   children: React.ReactNode
 }
 
-export function usePersistentCountryBackground() {
+function usePersistentCountryBackground() {
   const theme = useTheme()
   const [countryBackground, setCountryBackground] = React.useState({
     backgroundColor: `${(theme as ITheme).colors.backgroundPrimary}`,

packages/login/src/i18n/reducer.ts

@@ -31,7 +31,7 @@ export interface ILanguageState {
   [key: string]: ILanguage
 }
 
-export const initLanguages = () => {
+const initLanguages = () => {
   const initLanguages: ILanguageState = {}
   getAvailableLanguages().forEach((lang) => {
     initLanguages[lang] = {
@@ -50,7 +50,7 @@ export type IntlState = {
 
 const DEFAULT_MESSAGES = { default: 'default' }
 
-export const initialState: IntlState = {
+const initialState: IntlState = {
   language: getDefaultLanguage(),
   messages: DEFAULT_MESSAGES,
   languages: initLanguages()

packages/login/src/login/actions.ts

@@ -58,7 +58,7 @@ export enum FORGOTTEN_ITEMS {
   PASSWORD = 'password'
 }
 
-export type ApplicationConfigAction = {
+type ApplicationConfigAction = {
   type: typeof CONFIG_LOAD
 }
 
@@ -130,12 +130,12 @@ export type VerifyCodeFailedAction = {
   payload: Error
 }
 
-export type GoToAppAction = {
+type GoToAppAction = {
   type: typeof GOTO_APP
   payload: string
 }
 
-export type StoreReloadModalVisibilityAction = {
+type StoreReloadModalVisibilityAction = {
   type: typeof RELOAD_MODAL_VISIBILITY
   payload: { visibility: boolean }
 }
@@ -160,10 +160,6 @@ export type Action =
   | StoreClientRedirectRouteAction
   | StoreReloadModalVisibilityAction
 
-export const applicationConfigLoadAction = (): ApplicationConfigAction => ({
-  type: CONFIG_LOAD
-})
-
 export const resetSubmissionError = (): AuthenticationResetAction => {
   return {
     type: AUTHENTICATE_RESET
@@ -252,15 +248,6 @@ export const storeClientRedirectRoute = (
   }
 }
 
-export const storeReloadModalVisibility = (
-  visibility: boolean
-): StoreReloadModalVisibilityAction => {
-  return {
-    type: RELOAD_MODAL_VISIBILITY,
-    payload: { visibility }
-  }
-}
-
 export const verifyCode = (values: IVerifyCodeNumbers): VerifyCodeAction => {
   const code = Object.values(values).join('')
   return {
@@ -280,13 +267,7 @@ export const failVerifyCode = (error: AxiosError): VerifyCodeFailedAction => ({
   type: VERIFY_CODE_FAILED,
   payload: error
 })
-export function goBack() {
-  return back()
-}
-export const gotoApp = (appId: string): GoToAppAction => ({
-  type: GOTO_APP,
-  payload: appId
-})
+
 export function goToForgottenItemForm() {
   return push(FORGOTTEN_ITEM)
 }

packages/login/src/login/selectors.ts

@@ -67,14 +67,6 @@ export function selectApplicationName(store: IStoreState) {
   return getKey(store, 'config').APPLICATION_NAME
 }
 
-export function selectImageToObjectFit(store: IStoreState) {
-  if (getKey(store, 'config').LOGIN_BACKGROUND?.imageFit) {
-    return getKey(store, 'config').LOGIN_BACKGROUND?.imageFit
-  } else {
-    return getKey(store, 'config').LOGIN_BACKGROUND?.imageFit
-  }
-}
-
 export const getStepOneDetails = (
   store: IStoreState
 ): LoginState['authenticationDetails'] => getKey(store, 'authenticationDetails')

packages/login/src/navigation/routes.ts

@@ -17,5 +17,3 @@ export const RECOVERY_CODE_ENTRY = '/recovery-code'
 export const SECURITY_QUESTION = '/security-question'
 export const UPDATE_PASSWORD = '/reset-password'
 export const SUCCESS = '/success'
-
-export const REGISTER_APP = 'register'

packages/login/src/utils/authApi.ts

@@ -11,7 +11,7 @@
 import axios, { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios'
 import * as Sentry from '@sentry/react'
 
-export interface ICodeVerifyData {
+interface ICodeVerifyData {
   nonce: string
   code: string
 }
@@ -55,7 +55,7 @@ export interface IAuthenticateResponse {
   email?: string
 }
 
-export enum QUESTION_KEYS {
+enum QUESTION_KEYS {
   BIRTH_TOWN = 'BIRTH_TOWN',
   HIGH_SCHOOL = 'HIGH_SCHOOL',
   MOTHER_NAME = 'MOTHER_NAME',

packages/login/src/utils/authUtils.ts

@@ -11,14 +11,11 @@
 import decode from 'jwt-decode'
 import * as Sentry from '@sentry/react'
 
-export const ERROR_CODE_TOO_MANY_ATTEMPTS = 429
 export const ERROR_CODE_FIELD_MISSING = 500
 export const ERROR_CODE_INVALID_CREDENTIALS = 401
 export const ERROR_CODE_FORBIDDEN_CREDENTIALS = 403
 export const ERROR_CODE_PHONE_NUMBER_VALIDATE = 503
-export interface IURLParams {
-  [key: string]: string | string[] | undefined
-}
+
 export interface ITokenPayload {
   subject: string
   exp: string

packages/login/src/utils/dataCleanse.ts

@@ -31,7 +31,3 @@ export const convertToMSISDN = (phone: string, alpha3CountryCode: string) => {
       .replace(/[\s-]/g, '')
   )
 }
-
-export const getMSISDNCountryCode = (countryCode: string) => {
-  return callingCountries[countryCode.toUpperCase()].countryCallingCodes[0]
-}

packages/login/src/utils/fieldUtils.ts

@@ -27,11 +27,6 @@ export type Ii18nReduxFormFieldProps = {
   focusInput: boolean
 }
 
-export type IReduxFormFieldProps = {
-  placeholder?: MessageDescriptor
-  label?: MessageDescriptor
-} & Omit<Ii18nReduxFormFieldProps, 'placeholder' | 'label'>
-
 export type IFieldGroup = {
   [key: string]: Ii18nReduxFormFieldProps
 }

packages/login/src/utils/referenceApi.ts

@@ -11,7 +11,7 @@
 import { IntlMessages } from '@login/i18n/reducer'
 import { request } from './authApi'
 
-export interface ILanguage {
+interface ILanguage {
   lang: string
   displayName: string
   messages: IntlMessages

packages/login/src/utils/validate.ts

@@ -12,7 +12,7 @@ import { MessageDescriptor } from 'react-intl'
 import { PrimitiveType } from 'intl-messageformat'
 import { messages } from '@login/i18n/messages/validations'
 import { validate as validateEmail } from 'email-validator'
-export interface IValidationResult {
+interface IValidationResult {
   message: MessageDescriptor
   props?: { [key: string]: PrimitiveType }
 }
@@ -23,7 +23,7 @@ export const isAValidPhoneNumberFormat = (value: string): boolean => {
   const pattern = window.config.PHONE_NUMBER_PATTERN
   return new RegExp(pattern).test(value)
 }
-export const isAValidEmailAddressFormat = (value: string): boolean => {
+const isAValidEmailAddressFormat = (value: string): boolean => {
   return validateEmail(value)
 }
 

packages/login/src/views/Common.tsx

@@ -27,12 +27,6 @@ export const LogoContainer = styled.div`
   }
 `
 
-export interface IProps {
-  formId: string
-  submissionError: boolean
-  errorCode?: number
-}
-
 export const Container = styled.div`
   position: relative;
   height: auto;

packages/login/src/views/ResetCredentialsForm/Commons.tsx

@@ -10,25 +10,6 @@
  */
 import styled from 'styled-components'
 
-export const Title = styled.div`
-  ${({ theme }) => theme.fonts.h2};
-  color: ${({ theme }) => theme.colors.copy};
-`
-export const Page = styled.div`
-  color: ${({ theme }) => theme.colors.copy};
-  background: ${({ theme }) => theme.colors.white};
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  text-align: center;
-`
-export const Container = styled.div`
-  position: relative;
-  height: auto;
-  padding: 0px;
-  margin: 125px auto 0px auto;
-  max-width: 460px;
-`
 export const LogoContainer = styled.div`
   flex-direction: row;
   display: flex;

packages/login/src/views/ResetCredentialsForm/ResetCredentialsSuccessPage.tsx

@@ -42,7 +42,7 @@ type Props = { goToHome: typeof goToHome } & RouteComponentProps<
 > &
   IntlShapeProps & { logo: string | undefined }
 
-export const ResetCredentialsSuccessView = (props: Props) => {
+const ResetCredentialsSuccessView = (props: Props) => {
   const { logo, goToHome, intl, location } = props
   const { forgottenItem } = location.state