Add support for OnTheMarket links

Formula-Thoughts · Oct 10, 2024 · b6c4c3e · b6c4c3e
1 parent 9d978f4
commit b6c4c3e
Show file tree

Hide file tree

Showing 5 changed files with 64 additions and 1 deletion.
diff --git a/client/manifest.json b/client/manifest.json
@@ -1,5 +1,5 @@
 {
-  "version": "1.1.5",
+  "version": "1.1.6",
   "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA0bsGuxRgS5/cSnoPznlD7Wf09ouEtlf06G7N+FtVrw0LFurO3uOQIkxXIRwFN4uxOPdEjjNNZK/82VGdxo/PUGWH013DsZaFho2CvvpByn/hqlqfhhw8NqqyaGfIz369Tg1VOOY6p4qbXOydj9AH0eQrvcPUm5LjEv0sqEqzyKBMmJnjt5M5WFvOOHaJnxIQv4qt0AeieM4MmohDWVOe5upTVj0m0I4eOXTvURrRXtH/yAYu3i5uDaTFR+bwpI7tMbBtMfHb5jcwSpmx7Lv6tnbpRwQqcVmbjeYivaxI2Oav6KwD8d1+wUS76gcml1Z6WzBgwvA6xDNv0qlXE3OnCQIDAQAB",
   "manifest_version": 3,
   "name": "Flatini",
@@ -29,6 +29,7 @@
         "https://www.spareroom.co.uk/*",
         "https://www.zoopla.co.uk/*",
         "https://www.rightmove.co.uk/*",
+        "https://www.onthemarket.com/*",
         "https://localhost:3000/*",
         "https://flatini.formulathoughts.com/*",
         "https://v17eiwhzph.execute-api.eu-west-2.amazonaws.com/*"
@@ -46,6 +47,7 @@
     "https://www.spareroom.co.uk/*",
     "https://www.zoopla.co.uk/*",
     "https://www.rightmove.co.uk/*",
+    "https://www.onthemarket.com/*",
     "https://localhost:3000/",
     "https://flatini.formulathoughts.com/*",
     "https://v17eiwhzph.execute-api.eu-west-2.amazonaws.com/*",

diff --git a/client/src/App.tsx b/client/src/App.tsx
@@ -50,6 +50,10 @@ function App() {
             return "openrent";
           }
 
+          if (url?.includes("https://www.onthemarket.com/details/")) {
+            return "onthemarket";
+          }
+
           return null;
         };
 
@@ -71,6 +75,7 @@ function App() {
       url?.includes(
         "https://www.spareroom.co.uk/flatshare/flatshare_detail.pl?flatshare_id="
       ) ||
+      url?.includes("https://www.onthemarket.com/details/") ||
       url?.includes("https://www.openrent.co.uk/property-to-rent/")
     ) {
       navigate("/FlatView");

diff --git a/client/src/FlatView.tsx b/client/src/FlatView.tsx
@@ -2,6 +2,7 @@ import { createContext, useEffect, useState } from "react";
 import styled from "styled-components";
 import { Flat, useProvider } from "./context/AppProvider";
 import {
+  getFlatDataFromOnTheMarket,
   getFlatDataFromOpenRent,
   getFlatDataFromRightmove,
   getFlatDataFromSpareroom,
@@ -152,6 +153,19 @@ const FlatView = () => {
           };
         }
       );
+    } else if (activeUrl.propertyProvider === "onthemarket") {
+      return getFlatDataFromOnTheMarket(
+        activeUrl.tabId,
+        activeUrl.contents,
+        (title, url, price) => {
+          return {
+            ...activeFlatData,
+            price,
+            title,
+            url,
+          };
+        }
+      );
     }
   };
 

diff --git a/client/src/utils/url.ts b/client/src/utils/url.ts
@@ -94,6 +94,33 @@ export const getFlatDataFromRightmove = (
   return saveData();
 };
 
+export const getFlatDataFromOnTheMarket = (
+  tabId: number,
+  tabUrl: string,
+  onClickAction: (title: string, url: string, price: string) => void
+) => {
+  function extractPcmValue(priceStr: string): string | null {
+    const match = priceStr.match(/£([\d,]+) pcm/);
+    if (match) {
+      // Remove commas and convert to number
+      return parseInt(match[1].replace(/,/g, "")).toString();
+    }
+    return null; // Return null if no match found
+  }
+
+  const saveData = async () => {
+    const flatData = await getDomElementsFromActiveTab(tabId, [
+      { target: ".price", eq: 0 },
+      { target: ".text-slate", eq: 0 },
+    ]);
+    const price = flatData && extractPcmValue(flatData[0].data as string);
+    const title = flatData && flatData[1].data;
+    console.log("flatdata", flatData);
+    return onClickAction(title as string, tabUrl, price as string);
+  };
+  return saveData();
+};
+
 export const getFlatDataFromOpenRent = (
   tabId: number,
   tabUrl: string,

diff --git a/client/src/views/Explore.tsx b/client/src/views/Explore.tsx
@@ -91,6 +91,21 @@ const Explore = () => {
             label="Go to SpareRoom"
           />
         </Link>
+        <Link
+          href={`https://www.onthemarket.com/to-rent/`}
+          target="_blank"
+          rel="noreferrer"
+        >
+          <Button
+            style={{
+              width: "100%",
+              border: "2px solid rgba(255, 255, 255, 0.5)",
+              background: "transparent",
+              color: "white",
+            }}
+            label="Go to OnTheMarket"
+          />
+        </Link>
       </Wrapper>
     </MainLayout>
   );