From 5d7460547a22a760b2113e8fa162b075b0cf4424 Mon Sep 17 00:00:00 2001 From: ninaflaaten Date: Mon, 12 Oct 2026 16:18:10 +0200 Subject: [PATCH 01/31] Update preferences to match API --- .../src/components/plantCard/PlantCard.tsx | 172 +++++++++--------- frontend/src/components/profile/Profile.tsx | 14 +- frontend/src/i18n/locales/en/translation.json | 14 +- frontend/src/i18n/locales/no/translation.json | 14 +- 4 files changed, 97 insertions(+), 117 deletions(-) diff --git a/frontend/src/components/plantCard/PlantCard.tsx b/frontend/src/components/plantCard/PlantCard.tsx index 1827dd10..d461ab3c 100644 --- a/frontend/src/components/plantCard/PlantCard.tsx +++ b/frontend/src/components/plantCard/PlantCard.tsx @@ -1,108 +1,100 @@ -import {useState} from "react"; -import {useTranslation} from "react-i18next"; +import { useState } from "react"; +import { useTranslation } from "react-i18next"; import "./PlantCard.css"; type Props = { - name: string | null; - imageURL: string | null; - scientificName?: string[] | null; - description?: string | null; - watering?: string | null; - sunlight?: string[] | null; - careLevel?: string | null; - onInfo?: () => void; + name: string | null; + imageURL: string | null; + scientificName?: string[] | null; + description?: string | null; + watering?: string | null; + sunlight?: string[] | null; + careLevel?: string | null; + onInfo?: () => void; }; export default function PlantCard({ - name, - imageURL, - scientificName, - description, - watering, - sunlight, - careLevel, - onInfo, - }: Props) { - const {t} = useTranslation(); + name, + imageURL, + scientificName, + description, + watering, + sunlight, + careLevel, + onInfo, +}: Props) { + const { t } = useTranslation(); - const [isFlipped, setIsFlipped] = useState(false); + const [isFlipped, setIsFlipped] = useState(false); - function handleInfoClick() { - setIsFlipped(!isFlipped); - onInfo?.(); - } + function handleInfoClick() { + setIsFlipped(!isFlipped); + onInfo?.(); + } - return ( -
-
- + return ( +
+
+ -
-

{name}

- {imageURL ? ( - {name - ) : ( -
- - {t("plantCard.noImage")} - -
- )} -
- - -
+
+

{name}

+ {imageURL ? ( + {name + ) : ( +
+ )} +
-
-
-

{name}

- {scientificName && scientificName.length > 0 && ( -

{scientificName.join(", ")}

- )} + +
-
-
{t("plantCard.watering")}
-
{watering ?? t("plantCard.unknown")}
+
+
+

{name}

+ {scientificName && scientificName.length > 0 && ( +

{scientificName.join(", ")}

+ )} -
{t("plantCard.sunlight")}
-
- {sunlight && sunlight.length > 0 - ? sunlight.join(", ") - : t("plantCard.unknown")} -
+
+
{t("plantCard.watering")}
+
{watering ?? t("plantCard.unknown")}
-
{t("plantCard.careLevel")}
-
{careLevel ?? t("plantCard.unknown")}
-
+
{t("plantCard.sunlight")}
+
+ {sunlight && sunlight.length > 0 + ? sunlight.join(", ") + : t("plantCard.unknown")} +
- {description && ( -

{description}

- )} -
+
{t("plantCard.careLevel")}
+
{careLevel ?? t("plantCard.unknown")}
+
- -
+ {description && ( +

{description}

+ )}
- ); + + + + + ); } diff --git a/frontend/src/components/profile/Profile.tsx b/frontend/src/components/profile/Profile.tsx index b99153b7..e989bc6e 100644 --- a/frontend/src/components/profile/Profile.tsx +++ b/frontend/src/components/profile/Profile.tsx @@ -22,16 +22,12 @@ export default function Profile() { ]; const preferences: Preference[] = [ - {id: "flowering", translationKey: "preferences.flowering"}, - {id: "petFriendly", translationKey: "preferences.petFriendly"}, {id: "indoor", translationKey: "preferences.indoor"}, - {id: "outdoor", translationKey: "preferences.outdoor"}, - {id: "tropical", translationKey: "preferences.tropical"}, - {id: "hanging", translationKey: "preferences.hanging"}, - {id: "climbing", translationKey: "preferences.climbing"}, - {id: "large", translationKey: "preferences.large"}, - {id: "small", translationKey: "preferences.small"}, - {id: "succulents", translationKey: "preferences.succulents"}, + {id: "petFriendly", translationKey: "preferences.petFriendly"}, + {id: "droughtTolerant", translationKey: "preferences.droughtTolerant"}, + {id: "minimumWater", translationKey: "preferences.minimumWater"}, + {id: "easyCare", translationKey: "preferences.easyCare"}, + {id: "lowMaintenance", translationKey: "preferences.lowMaintenance"}, ]; return ( diff --git a/frontend/src/i18n/locales/en/translation.json b/frontend/src/i18n/locales/en/translation.json index b3d29636..8cbc999d 100644 --- a/frontend/src/i18n/locales/en/translation.json +++ b/frontend/src/i18n/locales/en/translation.json @@ -25,16 +25,12 @@ }, "preferences": { "title": "Plant preferences ❤", - "flowering": "flowering", - "petFriendly": "pet friendly", "indoor": "indoor", - "outdoor": "outdoor", - "tropical": "tropical", - "hanging": "hanging", - "climbing": "climbing", - "large": "large", - "small": "small", - "succulents": "succulent" + "petFriendly": "pet friendly", + "droughtTolerant": "drought tolerant", + "minimumWater": "low watering", + "easyCare": "easy care", + "lowMaintenance": "low maintenance" }, "explorePage": { "search": "Search for plants", diff --git a/frontend/src/i18n/locales/no/translation.json b/frontend/src/i18n/locales/no/translation.json index 0c4753e1..6172f716 100644 --- a/frontend/src/i18n/locales/no/translation.json +++ b/frontend/src/i18n/locales/no/translation.json @@ -25,16 +25,12 @@ }, "preferences": { "title": "Plantepreferanser ❤", - "flowering": "blomstrende", - "petFriendly": "dyrevennlig", "indoor": "inneplante", - "outdoor": "uteplante", - "tropical": "tropisk", - "hanging": "hengeplante", - "climbing": "klatreplante", - "large": "stor", - "small": "liten", - "succulents": "sukkulent" + "petFriendly": "dyrevennlig", + "droughtTolerant": "tåler tørke", + "minimumWater": "trenger lite vann", + "easyCare": "lettstelt", + "lowMaintenance": "lite vedlikehold" }, "explorePage": { "search": "Søk etter planter", From 3758d047600c175143653757f14838cbe98b81a9 Mon Sep 17 00:00:00 2001 From: Helene Lotsberg Date: Mon, 12 Oct 2026 13:00:29 +0200 Subject: [PATCH 02/31] fix file structure for tests --- frontend/src/tests/{test_profile => }/Profile.test.tsx | 0 .../tests/{test_profile => }/__snapshots__/Profile.test.tsx.snap | 0 2 files changed, 0 insertions(+), 0 deletions(-) rename frontend/src/tests/{test_profile => }/Profile.test.tsx (100%) rename frontend/src/tests/{test_profile => }/__snapshots__/Profile.test.tsx.snap (100%) diff --git a/frontend/src/tests/test_profile/Profile.test.tsx b/frontend/src/tests/Profile.test.tsx similarity index 100% rename from frontend/src/tests/test_profile/Profile.test.tsx rename to frontend/src/tests/Profile.test.tsx diff --git a/frontend/src/tests/test_profile/__snapshots__/Profile.test.tsx.snap b/frontend/src/tests/__snapshots__/Profile.test.tsx.snap similarity index 100% rename from frontend/src/tests/test_profile/__snapshots__/Profile.test.tsx.snap rename to frontend/src/tests/__snapshots__/Profile.test.tsx.snap From 0ddccc7da6ccdba474938c11ecc7366176d7823c Mon Sep 17 00:00:00 2001 From: Helene Lotsberg Date: Mon, 12 Oct 2026 13:09:33 +0200 Subject: [PATCH 03/31] refactured and re-organized the code --- frontend/src/AppRoutes.tsx | 10 +-- frontend/src/components/sidebar/Sidebar.tsx | 4 +- .../LanguageSwitcher.tsx | 0 .../{ => sidebarButtons}/SideBarButton.css | 0 .../{ => sidebarButtons}/ThemeToggle.tsx | 0 frontend/src/i18n/locales/en/translation.json | 2 +- frontend/src/i18n/locales/no/translation.json | 2 +- .../ExplorePlants.css} | 0 .../ExplorePlants.tsx} | 80 +++++++++---------- .../plantMatch/PlantMatchPage.css | 0 .../plantMatch/PlantMatchPage.tsx | 0 .../{components => pages}/profile/Profile.css | 0 .../{components => pages}/profile/Profile.tsx | 2 +- frontend/src/tests/ExplorePage.test.tsx | 18 ++--- frontend/src/tests/LanguageSwitcher.test.tsx | 2 +- frontend/src/tests/Sidebar.test.tsx | 2 +- frontend/src/tests/Translation.test.tsx | 2 +- 17 files changed, 62 insertions(+), 62 deletions(-) rename frontend/src/components/{languageSwitcher => sidebarButtons}/LanguageSwitcher.tsx (100%) rename frontend/src/components/{ => sidebarButtons}/SideBarButton.css (100%) rename frontend/src/components/{ => sidebarButtons}/ThemeToggle.tsx (100%) rename frontend/src/pages/{explorePage/ExplorePage.css => explorePlants/ExplorePlants.css} (100%) rename frontend/src/pages/{explorePage/ExplorePage.tsx => explorePlants/ExplorePlants.tsx} (68%) rename frontend/src/{components => pages}/plantMatch/PlantMatchPage.css (100%) rename frontend/src/{components => pages}/plantMatch/PlantMatchPage.tsx (100%) rename frontend/src/{components => pages}/profile/Profile.css (100%) rename frontend/src/{components => pages}/profile/Profile.tsx (97%) diff --git a/frontend/src/AppRoutes.tsx b/frontend/src/AppRoutes.tsx index e8045f46..fcc33204 100644 --- a/frontend/src/AppRoutes.tsx +++ b/frontend/src/AppRoutes.tsx @@ -1,8 +1,8 @@ import { Route, Routes } from "react-router-dom"; -import PlantMatchPage from "./components/plantMatch/PlantMatchPage.tsx"; -import ExplorePage from "./pages/explorePage/ExplorePage.tsx"; -import MyMatchesPage from "./pages/MyMatches/MyMatchesPage.tsx"; -import Profile from "./components/profile/Profile.tsx"; +import PlantMatchPage from "./pages/plantMatch/PlantMatchPage.tsx"; +import ExplorePlants from "./pages/explorePlants/ExplorePlants.tsx"; +import MyMatchesPage from "./pages/myMatches/MyMatchesPage.tsx"; +import Profile from "./pages/profile/Profile.tsx"; // eslint-disable-next-line react-refresh/only-export-components export const ROUTES = { @@ -16,7 +16,7 @@ function AppRoutes() { return ( } /> - } /> + } /> } /> } /> diff --git a/frontend/src/components/sidebar/Sidebar.tsx b/frontend/src/components/sidebar/Sidebar.tsx index e7fd748f..61b90cd0 100644 --- a/frontend/src/components/sidebar/Sidebar.tsx +++ b/frontend/src/components/sidebar/Sidebar.tsx @@ -1,7 +1,7 @@ import { useTranslation } from "react-i18next"; import { NavLink } from "react-router-dom"; -import LanguageSwitcher from "../languageSwitcher/LanguageSwitcher"; -import ThemeToggle from "../ThemeToggle"; +import LanguageSwitcher from "../sidebarButtons/LanguageSwitcher"; +import ThemeToggle from "../sidebarButtons/ThemeToggle"; import { ROUTES } from "../../AppRoutes"; import "./Sidebar.css"; diff --git a/frontend/src/components/languageSwitcher/LanguageSwitcher.tsx b/frontend/src/components/sidebarButtons/LanguageSwitcher.tsx similarity index 100% rename from frontend/src/components/languageSwitcher/LanguageSwitcher.tsx rename to frontend/src/components/sidebarButtons/LanguageSwitcher.tsx diff --git a/frontend/src/components/SideBarButton.css b/frontend/src/components/sidebarButtons/SideBarButton.css similarity index 100% rename from frontend/src/components/SideBarButton.css rename to frontend/src/components/sidebarButtons/SideBarButton.css diff --git a/frontend/src/components/ThemeToggle.tsx b/frontend/src/components/sidebarButtons/ThemeToggle.tsx similarity index 100% rename from frontend/src/components/ThemeToggle.tsx rename to frontend/src/components/sidebarButtons/ThemeToggle.tsx diff --git a/frontend/src/i18n/locales/en/translation.json b/frontend/src/i18n/locales/en/translation.json index 8cbc999d..49f2b83f 100644 --- a/frontend/src/i18n/locales/en/translation.json +++ b/frontend/src/i18n/locales/en/translation.json @@ -32,7 +32,7 @@ "easyCare": "easy care", "lowMaintenance": "low maintenance" }, - "explorePage": { + "ExplorePlants": { "search": "Search for plants", "watering": "Watering needs", "all": "All", diff --git a/frontend/src/i18n/locales/no/translation.json b/frontend/src/i18n/locales/no/translation.json index 6172f716..1dac435f 100644 --- a/frontend/src/i18n/locales/no/translation.json +++ b/frontend/src/i18n/locales/no/translation.json @@ -32,7 +32,7 @@ "easyCare": "lettstelt", "lowMaintenance": "lite vedlikehold" }, - "explorePage": { + "ExplorePlants": { "search": "Søk etter planter", "watering": "Vanningsbehov", "all": "Alle", diff --git a/frontend/src/pages/explorePage/ExplorePage.css b/frontend/src/pages/explorePlants/ExplorePlants.css similarity index 100% rename from frontend/src/pages/explorePage/ExplorePage.css rename to frontend/src/pages/explorePlants/ExplorePlants.css diff --git a/frontend/src/pages/explorePage/ExplorePage.tsx b/frontend/src/pages/explorePlants/ExplorePlants.tsx similarity index 68% rename from frontend/src/pages/explorePage/ExplorePage.tsx rename to frontend/src/pages/explorePlants/ExplorePlants.tsx index bef0c339..cc9ca409 100644 --- a/frontend/src/pages/explorePage/ExplorePage.tsx +++ b/frontend/src/pages/explorePlants/ExplorePlants.tsx @@ -2,7 +2,7 @@ import { useState } from "react"; import { useTranslation } from "react-i18next"; import { useDebounce } from "../../hooks/useDebounce"; import { useSessionState } from "../../hooks/useSessionState"; -import "./ExplorePage.css"; +import "./ExplorePlants.css"; // prettier-ignore const plants = [ @@ -23,16 +23,16 @@ const plants = [ { id: 15, name: "Carnation", watering: "average", sunlight: "full_sun", indoor: false, edible: true }, ]; -export default function ExplorePage() { +export default function ExplorePlants() { const { t } = useTranslation(); - const [search, setSearch] = useSessionState("explorePage.search"); + const [search, setSearch] = useSessionState("ExplorePlants.search"); const debouncedSearch = useDebounce(search, 800); const [openId, setOpenId] = useState(null); - const [watering, setWatering] = useSessionState("explorePage.watering"); - const [sunlight, setSunlight] = useSessionState("explorePage.sunlight"); - const [location, setLocation] = useSessionState("explorePage.location"); - const [edibility, setEdibility] = useSessionState("explorePage.edibility"); + const [watering, setWatering] = useSessionState("ExplorePlants.watering"); + const [sunlight, setSunlight] = useSessionState("ExplorePlants.sunlight"); + const [location, setLocation] = useSessionState("ExplorePlants.location"); + const [edibility, setEdibility] = useSessionState("ExplorePlants.edibility"); const filteredPlants = plants.filter( (plant) => @@ -59,10 +59,10 @@ export default function ExplorePage() { onSubmit={(e) => e.preventDefault()} >