feat(metadata-sidebar): global variables and enum upper case change

box · Aug 20, 2024 · 6002a63 · 6002a63
1 parent d8fbda0
commit 6002a63
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 12 deletions.
diff --git a/.storybook/typings.d.ts b/.storybook/typings.d.ts
@@ -1,6 +1,13 @@
 /* eslint-disable */
 // @ts-nocheck
 
+declare const global: {
+    FEATURES: Record<string, boolean>;
+    FILE_ID: string;
+    FOLDER_ID: string;
+    TOKEN: string;
+};
+
 declare module '*.md' {
     const content: string;
     export = content;
@@ -13,7 +20,13 @@ namespace BoxVisualTestUtils {
 
     async function takeScreenshot(id: string): Promise<Buffer>;
 
-    async function takeScreenshotAfterInput(id: string, selector: string, action?: string, userInput?: string, afterInputSelector?: string): Promise<Buffer>;
+    async function takeScreenshotAfterInput(
+        id: string,
+        selector: string,
+        action?: string,
+        userInput?: string,
+        afterInputSelector?: string,
+    ): Promise<Buffer>;
 
     async function takeModalScreenshot(id: string, width?: number, height?: number): Promise<Buffer>;
 

diff --git a/src/elements/content-sidebar/hooks/useSidebarMetadataFetcher.ts b/src/elements/content-sidebar/hooks/useSidebarMetadataFetcher.ts
@@ -18,10 +18,10 @@ import { MetadataTemplate, type MetadataEditor } from '../../../common/types/met
 import { type ExternalProps } from '../MetadataSidebarRedesign';
 
 enum Status {
-    Idle = 'idle',
-    Loading = 'loading',
-    Error = 'error',
-    Success = 'success',
+    IDLE = 'idle',
+    LOADING = 'loading',
+    ERROR = 'error',
+    SUCCESS = 'success',
 }
 interface DataFetcher {
     editors: Array<MetadataEditor>;
@@ -37,7 +37,7 @@ function useSidebarMetadataFetcher(
     onError: ErrorContextProps['onError'],
     isFeatureEnabled: ExternalProps['isFeatureEnabled'],
 ): DataFetcher {
-    const [status, setStatus] = React.useState<Status>(Status.Idle);
+    const [status, setStatus] = React.useState<Status>(Status.IDLE);
     const [file, setFile] = React.useState<BoxItem>(null);
     const [templates, setTemplates] = React.useState(null);
     const [errorMessage, setErrorMessage] = React.useState<MessageDescriptor | null>(null);
@@ -47,7 +47,7 @@ function useSidebarMetadataFetcher(
         (error: ElementsXhrError, code: string, message: MessageDescriptor) => {
             const { status: errorStatus } = error;
             const isValidError = isUserCorrectableError(errorStatus);
-            setStatus(Status.Error);
+            setStatus(Status.ERROR);
             setErrorMessage(message);
             onError(error, code, {
                 error,
@@ -67,7 +67,7 @@ function useSidebarMetadataFetcher(
         }) => {
             setEditors(fetchedEditors);
             setErrorMessage(null);
-            setStatus(Status.Success);
+            setStatus(Status.SUCCESS);
             setTemplates(fetchedTemplates);
         },
         [],
@@ -105,7 +105,7 @@ function useSidebarMetadataFetcher(
             if (shouldFetchMetadata && fetchedFile) {
                 fetchMetadata(fetchedFile);
             } else {
-                setStatus(Status.Success);
+                setStatus(Status.SUCCESS);
             }
         },
         [fetchMetadata, file],
@@ -120,8 +120,8 @@ function useSidebarMetadataFetcher(
     );
 
     React.useEffect(() => {
-        if (status === Status.Idle) {
-            setStatus(Status.Loading);
+        if (status === Status.IDLE) {
+            setStatus(Status.LOADING);
             api.getFileAPI().getFile(fileId, fetchFileSuccessCallback, fetchFileErrorCallback, {
                 fields: [FIELD_IS_EXTERNALLY_OWNED, FIELD_PERMISSIONS],
                 refreshCache: true,

diff --git a/src/elements/content-sidebar/stories/MetadataSidebarRedesign.stories.tsx b/src/elements/content-sidebar/stories/MetadataSidebarRedesign.stories.tsx
@@ -5,7 +5,7 @@ import MetadataSidebarRedesign from '../MetadataSidebarRedesign';
 import ContentSidebar from '../ContentSidebar';
 
 const fileIdWithNoMetadata = '416047501580';
-const token = 'P1n3ID8nYMxHRWvenDatQ9k6JKzWzYrz'; // global.TOKEN should be used this but throws error in tsx file and can't be pushed
+const token = global.TOKEN;
 const mockFeatures = {
     'metadata.redesign.enabled': true,
 };