feat/addBrokenLinksReporter (#1810)

## Problem

Adding broken link checker to front end


## Solution

Adds in the main UI for the broken link checkers. This is not design approved, the alignment with @sehyunidaaa at the moment is that we will use this to experiment how quickly users are able to repair their sites on their own before polishing the UI and removing the feature flag as a whole. 


Note: the introduction of the feature flag is done in a downstream pr.


Main user page: 

https://github.com/isomerpages/isomercms-frontend/assets/42832651/f38e6e77-de50-4a75-88e1-c75df19009b7

Only entry point: 

https://github.com/isomerpages/isomercms-frontend/assets/42832651/7574a34c-41f4-4a21-bcdb-95a935ffce56



**Breaking Changes**

<!-- Does this PR contain any backward incompatible changes? If so, what are they and should there be special considerations for release? -->

- [ ] Yes - this PR contains breaking changes
  - Details ...
- [X] No - this PR is backwards compatible with ALL of the following feature flags in this [doc](https://www.notion.so/opengov/Existing-feature-flags-518ad2cdc325420893a105e88c432be5)



## Tests

<!-- What tests should be run to confirm functionality? -->


- [ ] Log in to staging via github
- [ ] Access the page `/sites/<site-name>/linkCheckerReport` for any site [here](https://github.com/isomerpages/isomer-site-checker/)
- [ ] Verify that the content is loading, and you are able to access the page in staging + you are able to go into a valid edit page
- [ ] Verify that when you click on the breadcrumbs on the side, it leads to the correct table (ie what was done in the video above) 

## Deploy Notes

Need to clone site-link checker into both prod and staging

Author: kishore03109

src/assets/images/NoBrokenLinksImage.tsx

@@ -30,3 +30,4 @@ export * from "./EditorAccordionImage"
 export * from "./EditorCardsImage"
 export * from "./EditorDividerImage"
 export * from "./EditorCardsPlaceholderImage"
+export * from "./NoBrokenLinksImage"

src/assets/images/index.ts

@@ -22,6 +22,7 @@ export const SITE_DASHBOARD_INFO_KEY = "site-dashboard-info"
 export const SITE_DASHBOARD_REVIEW_REQUEST_KEY = "site-dashboard-review-request"
 export const SITE_DASHBOARD_COLLABORATORS_KEY = "site-dashboard-collaborators"
 export const SITE_DASHBOARD_LAUNCH_STATUS_KEY = "site-dashboard-launch-status"
+export const SITE_LINK_CHECKER_STATUS_KEY = "site-link-checker-status"
 export const NOTIFICATIONS_KEY = "notifications-content"
 export const ALL_NOTIFICATIONS_KEY = "all-notifications"
 export const LIST_COLLABORATORS_KEY = "list-collaborators"

src/constants/queryKeys.ts

@@ -0,0 +1,22 @@
+import { UseQueryResult, useQuery } from "react-query"
+
+import { SITE_LINK_CHECKER_STATUS_KEY } from "constants/queryKeys"
+
+import * as LinkCheckerService from "services/LinkCheckerService"
+
+import { RepoErrorDto } from "types/linkReport"
+
+export const useGetBrokenLinks = (
+  siteName: string
+): UseQueryResult<RepoErrorDto> => {
+  return useQuery<RepoErrorDto>(
+    [SITE_LINK_CHECKER_STATUS_KEY, siteName],
+    () => {
+      return LinkCheckerService.getLinkCheckerStatus({ siteName })
+    },
+    {
+      retry: false,
+      refetchInterval: 1000 * 10,
+    }
+  )
+}

src/hooks/siteDashboardHooks/useGetLinkChecker.ts

@@ -0,0 +1,22 @@
+import { AxiosError } from "axios"
+import { useMutation, UseMutationResult, useQueryClient } from "react-query"
+
+import { SITE_LINK_CHECKER_STATUS_KEY } from "constants/queryKeys"
+
+import * as LinkCheckerService from "services/LinkCheckerService"
+
+export const useRefreshLinkChecker = (
+  siteName: string
+): UseMutationResult<void, AxiosError, string> => {
+  const queryClient = useQueryClient()
+  return useMutation<void, AxiosError, string>(
+    async () => {
+      await LinkCheckerService.refreshLinkChecker({ siteName })
+    },
+    {
+      onSettled: () => {
+        queryClient.invalidateQueries([SITE_LINK_CHECKER_STATUS_KEY, siteName])
+      },
+    }
+  )
+}