From 0cb1d99e75dec2b10928c8c14c21b3941d431cd7 Mon Sep 17 00:00:00 2001 From: june Date: Sat, 16 Aug 2025 14:54:38 +1200 Subject: [PATCH 1/5] Tag pages working! --- src/components/Card/TagRow.astro | 2 +- src/data/pocketbase.ts | 20 +++++++++++++++++++- src/pages/tags/[name].astro | 18 ++++++++++++++++++ src/pages/tags/index.astro | 0 4 files changed, 38 insertions(+), 2 deletions(-) create mode 100644 src/pages/tags/[name].astro create mode 100644 src/pages/tags/index.astro diff --git a/src/components/Card/TagRow.astro b/src/components/Card/TagRow.astro index e1a644e..d9f8646 100644 --- a/src/components/Card/TagRow.astro +++ b/src/components/Card/TagRow.astro @@ -6,7 +6,7 @@ const { tags } = Astro.props { (tags ?? []).map(tag => ( {tag.name} diff --git a/src/data/pocketbase.ts b/src/data/pocketbase.ts index ef6d8de..c3f6c9a 100644 --- a/src/data/pocketbase.ts +++ b/src/data/pocketbase.ts @@ -29,7 +29,7 @@ class APIClient { // IMAGE async getImageURL(imgID: string, relative: boolean = true) { - const record = await this.client.collection("images").getOne(imgID) + const record = await this.client.collection(Collection.IMAGES).getOne(imgID) const res = this.client.files.getURL(record, record.image) return relative ? res.substring(21) : res } @@ -44,6 +44,24 @@ class APIClient { return urls } + async getTag(name: string) { + return await this.client.collection(Collection.TAGS).getList(1, 50, { filter: `name = '${name}'` }) + } + + async getRecipesOfTag(tagName: string) { + // get the tag id first + const tagResult = await this.getTag(tagName) + if (tagResult.items.length === 0) { + return [] + } + const tag = tagResult.items[0] + + return await this.client.collection(Collection.RECIPES).getFullList({ + filter: `tags ~ '${tag.id}'`, + expand: 'ingredients,tags,steps,images,steps.ingredients' + }) + } + } const client = new APIClient() export default client; \ No newline at end of file diff --git a/src/pages/tags/[name].astro b/src/pages/tags/[name].astro new file mode 100644 index 0000000..84159f3 --- /dev/null +++ b/src/pages/tags/[name].astro @@ -0,0 +1,18 @@ +--- +import SiteLayout from "@/layouts/base"; +import client from "@/data/pocketbase"; +import OverviewCard from "@/components/Card/OverviewCard"; + +const { name } = Astro.params +const recipes = await client.getRecipesOfTag(name) // todo redir to 404 if not found +--- + + +
+ { + recipes.map(r => ( + + )) + } +
+ \ No newline at end of file diff --git a/src/pages/tags/index.astro b/src/pages/tags/index.astro new file mode 100644 index 0000000..e69de29 -- 2.47.2 From c0267804602e8aeb11913e8ca7129fffaaf94ee4 Mon Sep 17 00:00:00 2001 From: june Date: Sat, 16 Aug 2025 14:58:47 +1200 Subject: [PATCH 2/5] Flavour text for showing recipe counts per tag --- src/pages/tags/[name].astro | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/pages/tags/[name].astro b/src/pages/tags/[name].astro index 84159f3..1d60ca2 100644 --- a/src/pages/tags/[name].astro +++ b/src/pages/tags/[name].astro @@ -8,6 +8,10 @@ const recipes = await client.getRecipesOfTag(name) // todo redir to 404 if not f --- +

+ {recipes.length} { recipes.length == 1 ? "Recipe" : "Recipes" } with: {name} +

+
{ recipes.map(r => ( -- 2.47.2 From 1cffd0b7e726be53a99c7362c2dbc883ca2b9ebe Mon Sep 17 00:00:00 2001 From: june Date: Sat, 16 Aug 2025 22:59:45 +1200 Subject: [PATCH 3/5] dont have it in me to do more design rn --- src/components/Header.astro | 7 ++++--- src/data/pocketbase.ts | 4 ++++ src/pages/index.astro | 2 +- src/pages/tags/[name].astro | 2 +- src/pages/tags/index.astro | 24 ++++++++++++++++++++++++ src/styles/global.css | 4 ++++ 6 files changed, 38 insertions(+), 5 deletions(-) diff --git a/src/components/Header.astro b/src/components/Header.astro index 28dd602..89595c5 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -7,8 +7,9 @@
- new - tags - search + new + add + + search
\ No newline at end of file diff --git a/src/data/pocketbase.ts b/src/data/pocketbase.ts index c3f6c9a..8684c0a 100644 --- a/src/data/pocketbase.ts +++ b/src/data/pocketbase.ts @@ -44,6 +44,10 @@ class APIClient { return urls } + async getAllTags() { + return await this.client.collection(Collection.TAGS).getFullList() + } + async getTag(name: string) { return await this.client.collection(Collection.TAGS).getList(1, 50, { filter: `name = '${name}'` }) } diff --git a/src/pages/index.astro b/src/pages/index.astro index 592c409..b7a4865 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -9,7 +9,7 @@ const recipes = await client.getAllRecipes() -
+
{ recipes.map(r => ( diff --git a/src/pages/tags/[name].astro b/src/pages/tags/[name].astro index 1d60ca2..4d0285a 100644 --- a/src/pages/tags/[name].astro +++ b/src/pages/tags/[name].astro @@ -9,7 +9,7 @@ const recipes = await client.getRecipesOfTag(name) // todo redir to 404 if not f

- {recipes.length} { recipes.length == 1 ? "Recipe" : "Recipes" } with: {name} + {recipes.length} { recipes.length == 1 ? "Recipe" : "Recipes" } with: {name}

diff --git a/src/pages/tags/index.astro b/src/pages/tags/index.astro index e69de29..0f691a4 100644 --- a/src/pages/tags/index.astro +++ b/src/pages/tags/index.astro @@ -0,0 +1,24 @@ +--- +import client from "@/data/pocketbase"; +import SiteLayout from "@/layouts/base"; + +const tags = await client.getAllTags() + +const countsPerTag = await Promise.all( + tags.map(async t => (await client.getRecipesOfTag(t.name)).length) +) +--- + + +

+ {tags.length} Tags +

+ { + (tags ?? []).map((t, i) => ( + //

{t.name} -> {countsPerTag[i]} {countsPerTag[i] == 1 ? "Recipe" : "Recipes" }

+ + {t.name} ({countsPerTag[i]}) +
+ )) + } + \ No newline at end of file diff --git a/src/styles/global.css b/src/styles/global.css index 12ec143..bdf651e 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -7,4 +7,8 @@ html { /* @apply font-; */ @apply font-sans; /* font-family: 'SF Pro Display', 'Segoe UI', 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; */ +} + +.title { + @apply text-2xl; } \ No newline at end of file -- 2.47.2 From a9d739da39210983d13fc6e1a85887ebebc9b9b5 Mon Sep 17 00:00:00 2001 From: june Date: Sat, 16 Aug 2025 23:09:30 +1200 Subject: [PATCH 4/5] meow --- src/pages/index.astro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index b7a4865..47d2734 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -9,7 +9,7 @@ const recipes = await client.getAllRecipes() -
+
{ recipes.map(r => ( -- 2.47.2 From 660430f7e6fd6bf77260c4c2281afe2b96362d25 Mon Sep 17 00:00:00 2001 From: june Date: Sat, 16 Aug 2025 23:16:06 +1200 Subject: [PATCH 5/5] add 404 page idek --- src/pages/404.astro | 9 +++++++++ src/pages/tags/[name].astro | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 src/pages/404.astro diff --git a/src/pages/404.astro b/src/pages/404.astro new file mode 100644 index 0000000..a678d68 --- /dev/null +++ b/src/pages/404.astro @@ -0,0 +1,9 @@ +--- +import Base from "@/layouts/base"; +--- + + +
+ 🥧 404 🥧 +
+ \ No newline at end of file diff --git a/src/pages/tags/[name].astro b/src/pages/tags/[name].astro index 4d0285a..130a9bf 100644 --- a/src/pages/tags/[name].astro +++ b/src/pages/tags/[name].astro @@ -12,7 +12,7 @@ const recipes = await client.getRecipesOfTag(name) // todo redir to 404 if not f {recipes.length} { recipes.length == 1 ? "Recipe" : "Recipes" } with: {name}

-
+
{ recipes.map(r => ( -- 2.47.2