trying to catch url with query

client/homebrew/homebrew.jsx

@@ -76,6 +76,7 @@ const Homebrew = createClass({
 						<Route path='/print/:id' element={<WithRoute el={PrintPage} brew={this.props.brew} />} />
 						<Route path='/print' element={<WithRoute el={PrintPage} />} />
 						<Route path='/archive' element={<WithRoute el={ArchivePage}/>}/>
+						<Route path='/archive/:query' element={<WithRoute el={ArchivePage}/>}/>
 						<Route path='/changelog' element={<WithRoute el={SharePage} brew={this.props.brew} />} />
 						<Route path='/faq' element={<WithRoute el={SharePage} brew={this.props.brew} />} />
 						<Route path='/account' element={<WithRoute el={AccountPage} brew={this.props.brew} uiItems={this.props.brew.uiItems} />} />

client/homebrew/pages/archivePage/archivePage.jsx

@@ -27,6 +27,20 @@ const ArchivePage = createClass({
       error      : null,
     };
   },
+  componentDidMount: function () {
+    const url = new URL(window.location.href);
+    const pathSegments = url.pathname.split('/');
+
+    // Check if there's a path parameter after /archive/
+    if (pathSegments.length > 2 && pathSegments[1] === 'archive') {
+        const pathQuery = pathSegments[2];
+        console.log(pathQuery);
+        this.setState({ query: pathQuery }, () => {
+            this.lookup();
+        });
+    }
+  },
+
   handleChange(e) {
     this.setState({ query: e.target.value });
   },
@@ -39,13 +53,28 @@ const ArchivePage = createClass({
       .catch((err) => this.setState({ error: err }))
       .finally(() => this.setState({ searching: false }));
   },
+  updateUrl: function(query) {
+    const url = new URL(window.location.href);
+    const urlParams = new URLSearchParams(url.search);
+    // Clear existing parameters
+    urlParams.delete('sort');
+    urlParams.delete('dir');
+    urlParams.delete('filter');
+
+    // Set the pathname to '/archive/query'
+    url.pathname = `/archive/${this.state.query}`;
+
+    url.search = urlParams;
+    window.history.replaceState(null, null, url);
+},
   renderFoundBrews() {
     const brews = this.state.brewCollection;
 
     if (!brews || brews.length === 0) {
       return <div>No brews found.</div>;
     }
-
+    console.table(brews);
+    this.updateUrl();
       return <ListPage brewCollection={this.state.brewCollection} /*navItems={this.navItems()}*/ reportError={this.errorReported}></ListPage>;
     
   },
@@ -76,7 +105,7 @@ const ArchivePage = createClass({
     );
   },
 
-  renderResults: function () {},
+  
 
   renderNavItems: function () {
     return (

server/archive.api.js

@@ -17,7 +17,6 @@ const archive = {
             // No published documents found with the given title
             return res.status(404).json({ error: 'Published documents not found' });
           }
-      
           return res.json(brews);
         } catch (error) {
           console.error(error);
@@ -28,4 +27,4 @@ const archive = {
 router.get('/archive/:query', asyncHandler(archive.findBrews));
 
 
-module.exports = archive;
+module.exports = router;