Fix alert URL for page changes

jamerst · Oct 17, 2022 · fe2f72d · fe2f72d
1 parent eed1453
commit fe2f72d
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 34 deletions.
diff --git a/jobhunt/PageWatcher/PageWatcher.cs b/jobhunt/PageWatcher/PageWatcher.cs
@@ -177,7 +177,7 @@ await _alertService.CreateAsync(new Alert
                     Type = AlertType.PageUpdate,
                     Title = $"{page.Company.Name} page updated",
                     Message = $"'{page.Url}' content has changed",
-                    Url = $"/page-changes/{change.Id}"
+                    Url = $"/page-changes/{change.WatchedPageId}/{change.Id}"
                 });
             }
         }

diff --git a/jobhunt/Workers/PageScreenshotWorker.cs b/jobhunt/Workers/PageScreenshotWorker.cs
@@ -158,6 +158,8 @@ public async Task<int> TakeScreenshotsAsync(CancellationToken token)
                             using (var img = SKBitmap.Decode(screenshot.AsByteArray))
                             {
                                 var webp = img?.Encode(SKEncodedImageFormat.Webp, _options.QualityPercent);
+                                // webp might be null in some cases
+                                // I think this can be caused by pages which play audio, or videos with an audio track.
                                 if (webp != null)
                                 {
                                     using (var output = File.OpenWrite(savePath))

diff --git a/jobhunt/client/index.html b/jobhunt/client/index.html
@@ -5,25 +5,9 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
+
     <link rel="manifest" href="/manifest.json" />
-    <!--
-      Notice the use of  in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
 
-      Unlike "/favicon.ico" or "favicon.ico", "/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
     <link rel="stylesheet" type="text/css" href="/static.css" />
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />
     <title>JobHunt</title>
@@ -37,15 +21,5 @@
       </div>
     </div>
     <script type="module" src="/src/index.tsx"></script>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
   </body>
 </html>
diff --git a/jobhunt/client/src/App.tsx b/jobhunt/client/src/App.tsx
@@ -128,12 +128,12 @@ const App = withErrorBoundary(() => {
               <Dashboard />
             </MainLayout>
           } />
+
           <Route path="/jobs" element={
             <MainLayout pageTitle="Saved Jobs">
               <Jobs />
             </MainLayout>
           } />
-
           <Route path="/job/:id" element={
             <MainLayout>
               <Job />
@@ -145,7 +145,6 @@ const App = withErrorBoundary(() => {
               <Companies />
             </MainLayout>
           } />
-
           <Route path="/company/:id" element={
             <MainLayout>
               <Company />
@@ -163,6 +162,11 @@ const App = withErrorBoundary(() => {
               <PageChanges />
             </MainLayout>
           } />
+          <Route path="/page-changes/:id/:change" element={
+            <MainLayout pageTitle="Page Changes">
+              <PageChanges />
+            </MainLayout>
+          } />
         </Routes>
       </BrowserRouter>
     </ThemeProvider>

diff --git a/jobhunt/client/src/views/PageChanges.tsx b/jobhunt/client/src/views/PageChanges.tsx
@@ -50,7 +50,7 @@ const PageChanges = () => {
   const [currentIndex, setCurrentIndex] = useState(0);
   const [view, setView] = useState("image");
 
-  const { id } = useParams();
+  const { id, change } = useParams();
   const { classes } = useStyles();
 
   useEffect(() => {
@@ -61,8 +61,14 @@ const PageChanges = () => {
         setWatchedPage(data);
 
         if (data.changes.length > 0) {
-          setCurrent(data.changes[0].id);
-          setCurrentIndex(0);
+          if (change) {
+            const changeId = parseInt(change, 10);
+            setCurrent(changeId);
+            setCurrentIndex(data.changes.findIndex(c => c.id === changeId));
+          } else {
+            setCurrent(data.changes[0].id);
+            setCurrentIndex(0);
+          }
         } else {
           setCurrent(0);
           setCurrentIndex(0);
@@ -71,7 +77,7 @@ const PageChanges = () => {
     }
 
     fetchPage();
-  }, [id]);
+  }, [id, change]);
 
   const changes = useMemo(() => !watchedPage?.changes ? [] : (watchedPage.changes ?? []).map((c, i) => {
     const hasPrevious = i < watchedPage.changes.length - 1;