feat(docgen-sidebar): add polling to tags loading in dogen sidebar

src/elements/content-sidebar/DocGenSidebar/DocGenSidebar.tsx

@@ -86,13 +86,20 @@ const DocGenSidebar = ({ getDocGenTags }: Props) => {
         return jsonPathsMap;
     };
 
-    const loadTags = async () => {
+
+    const loadTags = async (attempts = 10) => {
+        if(attempts <= 0){
+            return
+        }
         setIsLoading(true);
         try {
             const response: DocGenTemplateTagsResponse = await getDocGenTags();
-            if (response && !!response.data) {
+            if(response.message){
+                loadTags(attempts - 1);
+            } else if (response && !!response.data) {
                 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                 // @ts-ignore
+
                 const { data } = response || [];
 
                 // anything that is not an image tag for this view is treated as a text tag
@@ -107,20 +114,23 @@ const DocGenSidebar = ({ getDocGenTags }: Props) => {
                     imageTree: tagsToJsonPaths(imageTags),
                 });
                 setHasError(false);
+                setIsLoading(false);
             } else {
                 setHasError(true);
+                setIsLoading(false);
             }
         } catch (error) {
             setHasError(true);
+            setIsLoading(false);
         }
-        setIsLoading(false);
-    };
-
+    }
+
     React.useEffect(() => {
-        loadTags();
+        loadTags(10);
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 
+
     const isEmpty = tags.image.length + tags.text.length === 0;
 
     return (

src/elements/content-sidebar/DocGenSidebar/types.ts

@@ -10,6 +10,7 @@ export type DocGenTag = {
 
 export type DocGenTemplateTagsResponse = {
     data?: DocGenTag[];
+    message?: string;
     pagination?: {
         previousMarker?: string;
         nextMarker?: string;

src/elements/content-sidebar/__tests__/DocGenSidebar.test.tsx

@@ -14,6 +14,9 @@ const docGenSidebarProps = {
 };
 
 const noTagsMock = jest.fn().mockReturnValue(Promise.resolve({ data: [] }));
+const processingTagsMock = jest.fn().mockReturnValue(Promise.resolve({
+    "message": "Processing tags for this file."
+}));
 const errorTagsMock = jest.fn().mockRejectedValue([]);
 const noDataMock = jest.fn().mockReturnValue(Promise.resolve({}));
 
@@ -77,6 +80,15 @@ describe('elements/content-sidebar/DocGenSidebar', () => {
         });
     });
 
+
+    test('should re-trigger loadTags if the tempalte is still processing', async () => {
+        renderComponent({
+            getDocGenTags: processingTagsMock,
+        });
+
+        await waitFor(() => expect(processingTagsMock).toHaveBeenCalledTimes(10));
+    });
+
     test('should re-trigger getDocGenTags on click on refresh button', async () => {
         renderComponent({
             getDocGenTags: errorTagsMock,
@@ -88,7 +100,7 @@ describe('elements/content-sidebar/DocGenSidebar', () => {
         const refreshButton = screen.getByRole('button', { name: 'Process document' });
         fireEvent.click(refreshButton);
 
-        await waitFor(() => expect(errorTagsMock).toBeCalledTimes(2));
+        await waitFor(() => expect(errorTagsMock).toHaveBeenCalledTimes(2));
     });
 
     test('should handle undefined data', async () => {