fix(ci): use knip instead of depcheck

ui/.depcheckrc.yaml

@@ -1,24 +0,0 @@
-skip-missing: true
-ignores:
-  # deps
-  - bootstrap
-  - bootswatch
-  - sass
-  - typeface-open-sans
-  - prettier
-  - vite
-  - typescript
-  # devDeps
-  - "csstype"
-  - "@types/jest"
-  - "@types/node"
-  - "eslint-plugin-jest"
-  - "node-fetch"
-  - eslint
-  - fetch-mock
-  - identity-obj-proxy
-  - jest
-  - "@playwright/test"
-  - terser
-  - stylelint
-  - stylelint-config-standard-scss

ui/Makefile

@@ -47,10 +47,11 @@ update-e2e:
 	npx playwright test --update-snapshots
 
 .PHONY: lint
-lint: $(NODE_PATH)/eslint $(NODE_PATH)/stylelint
+lint: $(NODE_PATH)/eslint $(NODE_PATH)/stylelint $(NODE_PATH)/knip
 	eslint
 	tsc --noEmit -p .
 	stylelint 'src/**/*.scss' 'src/**/*.css'
+	knip
 
 .PHONY: lint-typescript
 lint-typescript:

ui/knip.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "https://unpkg.com/knip@5/schema.json",
+  "tags": [
+    "-lintignore"
+  ],
+  "entry": [
+    "src/e2e/stories.tsx"
+  ],
+  "ignore": [
+    "src/Styles/**",
+    "vite-env.d.ts"
+  ],
+  "ignoreDependencies": [
+    "bootstrap",
+    "bootswatch",
+    "typeface-open-sans",
+    "prettier"
+  ],
+  "ignoreBinaries": [
+    "source-map-explorer"
+  ]
+}

ui/package.json

@@ -64,16 +64,14 @@
     "@types/react-dom": "19.2.3",
     "@vitejs/plugin-legacy": "8.0.0",
     "@vitejs/plugin-react": "6.0.1",
-    "csstype": "3.2.3",
     "eslint": "10.1.0",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-jest": "29.15.0",
     "eslint-plugin-react-compiler": "19.1.0-rc.2",
-    "fetch-mock": "12.6.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "30.3.0",
     "jest-environment-jsdom": "30.3.0",
-    "node-fetch": "3.3.2",
+    "knip": "6.0.2",
     "prettier": "3.8.1",
     "sass": "1.98.0",
     "stylelint": "17.5.0",
@@ -88,7 +86,8 @@
     "start": "vite",
     "build": "tsc && vite build",
     "test": "jest",
-    "analyze": "npx source-map-explorer 'dist/assets/*.js'"
+    "analyze": "npx source-map-explorer 'dist/assets/*.js'",
+    "knip": "knip"
   },
   "jest": {
     "collectCoverageFrom": [

ui/src/Common/Hash.ts

@@ -25,4 +25,4 @@ const hashString = (s: string): number =>
 const hashObject = (o: { [key: string]: any }): number =>
   hashString(JSON.stringify(o, normalize(), 2));
 
-export { normalize, hashString, hashObject };
+export { hashObject };

ui/src/Common/LocalStore.ts

@@ -50,4 +50,3 @@ function localStored<T extends object>(
 }
 
 export { localStored };
-export type { LocalStoreResult };

ui/src/Components/Fetcher/index.tsx

@@ -266,4 +266,4 @@ const Fetcher: FC<{
   );
 });
 
-export { Fetcher, Dots, PlayButton, PauseButton };
+export { Fetcher, Dots };

ui/src/Components/Grid/AlertGrid/GridSize.ts

@@ -31,4 +31,4 @@ const GetGridElementWidth = (
     (innerWidth - outerPadding) / GetColumnsCount(outerWidth, baseWidth),
   );
 
-export { GridSizesConfig, GetColumnsCount, GetGridElementWidth };
+export { GridSizesConfig, GetGridElementWidth };

ui/src/Components/Labels/Utils.ts

@@ -10,7 +10,7 @@ import type { AlertStore } from "Stores/AlertStore";
 
 const isBackgroundDark = (brightness: number) => brightness <= 130;
 
-export interface ClassAndStyleT {
+interface ClassAndStyleT {
   style: { [key: string]: string | number };
   className: string;
   baseClassNames: string[];

ui/src/Components/ManagedSilence/DeleteSilence.tsx

@@ -207,4 +207,4 @@ const DeleteSilence: FC<{
   );
 };
 
-export { DeleteSilence, DeleteSilenceModalContent, DeleteResult };
+export { DeleteSilence, DeleteSilenceModalContent };

ui/src/Components/ManagedSilence/SilenceComment.tsx

@@ -132,4 +132,4 @@ const SilenceComment: FC<{
   },
 );
 
-export { SilenceComment, SilenceProgress };
+export { SilenceComment };

ui/src/Components/SilenceModal/Browser/MassDelete.tsx

@@ -194,7 +194,7 @@ const SilenceDeleteModalContent: FC<{
   );
 };
 
-export const MassDeleteProgress: FC<{
+const MassDeleteProgress: FC<{
   alertStore: AlertStore;
   silences: ClusterSilenceT[];
 }> = observer(({ alertStore, silences }) => {

ui/src/Hooks/useFetchAny.ts

@@ -14,7 +14,7 @@ export type FetchFunctionT = (
   init?: RequestInit | undefined,
 ) => Promise<Response>;
 
-export interface FetchAnyOptionsT {
+interface FetchAnyOptionsT {
   fetcher?: null | FetchFunctionT;
 }
 

ui/src/Hooks/useFetchDelete.ts

@@ -4,9 +4,9 @@ import merge from "lodash.merge";
 
 import { CommonOptions } from "Common/Fetch";
 
-export type useFetchDeleteDepsT = string[] | number[];
+type useFetchDeleteDepsT = string[] | number[];
 
-export interface ResponseStateT {
+interface ResponseStateT {
   response: null | string;
   error: null | string;
   isDeleting: boolean;

ui/src/Stores/SilenceFormStore.ts

@@ -81,7 +81,7 @@ export const EscapeRegex = (v: string): string => {
   return v.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&");
 };
 
-export const UnescapeRegex = (v: string): string => {
+const UnescapeRegex = (v: string): string => {
   return v.replaceAll("\\", "");
 };
 
@@ -270,8 +270,8 @@ const UnpackRegexMatcherValues = (isRegex: boolean, value: string) => {
   }
 };
 
-export type SilenceFormTabT = "editor" | "browser";
-export type SilenceFormStageT = "form" | "preview" | "submit";
+type SilenceFormTabT = "editor" | "browser";
+type SilenceFormStageT = "form" | "preview" | "submit";
 
 interface SilenceFormStoreToggleT {
   visible: boolean;
@@ -709,7 +709,6 @@ export {
   NewEmptyMatcher,
   AlertmanagerClustersToOption,
   MatchersFromGroup,
-  MatchersFromAlerts,
   GenerateAlertmanagerSilenceData,
   NewClusterRequest,
   MatcherToOperator,

ui/src/react-app-env.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react-scripts" />
-
 declare module "react-media-hook" {
   function useMediaPredicate(query: string): boolean;
 }