From 34065698ce4add0591e4ded5eafc236813d8ad22 Mon Sep 17 00:00:00 2001 From: Thomas McSherry <54848048+ThomasMcSherry@users.noreply.github.com> Date: Fri, 20 Oct 2023 12:32:13 +0100 Subject: [PATCH 1/6] Created WineTastingCard and added it to the Home page --- vinoa-web/app/monthsWine/page.tsx | 4 +-- vinoa-web/app/page.tsx | 21 ++++++++++++--- vinoa-web/app/wines/page.tsx | 4 +-- .../components/UserProfile/UserProfile.tsx | 2 +- vinoa-web/components/WineCard/index.ts | 2 -- .../components/WineCarousel/WineCarousel.tsx | 4 +-- .../WineListCard.tsx} | 4 +-- vinoa-web/components/WineListCard/index.ts | 2 ++ .../WineTastingCard/WineTastingCard.tsx | 26 +++++++++++++++++++ vinoa-web/components/WineTastingCard/index.ts | 2 ++ vinoa-web/tailwind.config.js | 1 + vinoa-web/types/Wine.ts | 1 + 12 files changed, 59 insertions(+), 14 deletions(-) delete mode 100644 vinoa-web/components/WineCard/index.ts rename vinoa-web/components/{WineCard/WineCard.tsx => WineListCard/WineListCard.tsx} (94%) create mode 100644 vinoa-web/components/WineListCard/index.ts create mode 100644 vinoa-web/components/WineTastingCard/WineTastingCard.tsx create mode 100644 vinoa-web/components/WineTastingCard/index.ts diff --git a/vinoa-web/app/monthsWine/page.tsx b/vinoa-web/app/monthsWine/page.tsx index c1516eb..a8cda5f 100644 --- a/vinoa-web/app/monthsWine/page.tsx +++ b/vinoa-web/app/monthsWine/page.tsx @@ -1,4 +1,4 @@ -import WineCard from '@/components/WineCard'; +import WineListCard from '@/components/WineListCard'; import { getCurrentMonthAsRange } from '@/lib/utils/helperFunctions'; import { getThisMonthsWines } from '@/sanity/sanity-utils/wine-utils'; @@ -13,7 +13,7 @@ const MonthsWinePage = async () => { diff --git a/vinoa-web/app/page.tsx b/vinoa-web/app/page.tsx index 01ace29..ef850bc 100644 --- a/vinoa-web/app/page.tsx +++ b/vinoa-web/app/page.tsx @@ -1,16 +1,31 @@ import WineCarousel from '@/components/WineCarousel'; import WineButton from '@/components/WineButton'; -import { getWines } from '@/sanity/sanity-utils/wine-utils'; +import { getThisMonthsWines, getWines } from '@/sanity/sanity-utils/wine-utils'; +import WineTastingCard from '@/components/WineTastingCard'; +import { getCurrentMonthAsRange } from '@/lib/utils/helperFunctions'; export const dynamic = 'force-dynamic'; export default async function Home() { const wines = await getWines(); + const date = getCurrentMonthAsRange(); + + const thisMonthsWines: Wine[] = await getThisMonthsWines(date.from, date.to); return (
- - + +
+
+ {thisMonthsWines.map((wine, index) =>{ + + return( + + ) + })} +
+
+
); } diff --git a/vinoa-web/app/wines/page.tsx b/vinoa-web/app/wines/page.tsx index 12069c9..51bc20b 100644 --- a/vinoa-web/app/wines/page.tsx +++ b/vinoa-web/app/wines/page.tsx @@ -1,4 +1,4 @@ -import WineCard from '@/components/WineCard'; +import WineListCard from '@/components/WineListCard'; import { getWines } from '@/sanity/sanity-utils/wine-utils'; export const dynamic = 'force-dynamic'; @@ -11,7 +11,7 @@ const WinesPage = async () => { diff --git a/vinoa-web/components/UserProfile/UserProfile.tsx b/vinoa-web/components/UserProfile/UserProfile.tsx index 6e12604..1087798 100644 --- a/vinoa-web/components/UserProfile/UserProfile.tsx +++ b/vinoa-web/components/UserProfile/UserProfile.tsx @@ -1,7 +1,7 @@ 'use client'; import ProfileLogo from '@/lib/assets/ProfileLogo'; import { BsPencilFill } from 'react-icons/bs'; -import WineCard from '../WineCard'; +import WineCard from '../WineListCard'; import { useEffect } from 'react'; import { useSanityUserStore, useUserStore } from '@/store/store'; diff --git a/vinoa-web/components/WineCard/index.ts b/vinoa-web/components/WineCard/index.ts deleted file mode 100644 index 7966ad5..0000000 --- a/vinoa-web/components/WineCard/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -import WineCard from './WineCard'; -export default WineCard; diff --git a/vinoa-web/components/WineCarousel/WineCarousel.tsx b/vinoa-web/components/WineCarousel/WineCarousel.tsx index 5616799..11e63d3 100644 --- a/vinoa-web/components/WineCarousel/WineCarousel.tsx +++ b/vinoa-web/components/WineCarousel/WineCarousel.tsx @@ -3,7 +3,7 @@ import { AiOutlineArrowRight, AiOutlineArrowLeft } from 'react-icons/ai'; import 'swiper/css'; import { Keyboard, Navigation } from 'swiper/modules'; import { Swiper, SwiperSlide } from 'swiper/react'; -import WineCard from '@/components/WineCard/WineCard'; +import WineListCard from '@/components/WineListCard/WineListCard'; interface WineProps { wines: Wine[]; @@ -38,7 +38,7 @@ const WineCarousel = ({ wines }: WineProps) => { > {wines.map((wine) => ( - + ))} diff --git a/vinoa-web/components/WineCard/WineCard.tsx b/vinoa-web/components/WineListCard/WineListCard.tsx similarity index 94% rename from vinoa-web/components/WineCard/WineCard.tsx rename to vinoa-web/components/WineListCard/WineListCard.tsx index 8fd4d81..e3674cb 100644 --- a/vinoa-web/components/WineCard/WineCard.tsx +++ b/vinoa-web/components/WineListCard/WineListCard.tsx @@ -4,7 +4,7 @@ import Link from 'next/link'; interface WineProps { wine: Wine; } -const WineCard = ({ +const WineListCard = ({ wine: { name, imageUrl, country, region, colour, smell, taste, slug }, }: WineProps) => { return ( @@ -35,4 +35,4 @@ const WineCard = ({ ); }; -export default WineCard; +export default WineListCard; diff --git a/vinoa-web/components/WineListCard/index.ts b/vinoa-web/components/WineListCard/index.ts new file mode 100644 index 0000000..b5b669a --- /dev/null +++ b/vinoa-web/components/WineListCard/index.ts @@ -0,0 +1,2 @@ +import WineListCard from './WineListCard'; +export default WineListCard; diff --git a/vinoa-web/components/WineTastingCard/WineTastingCard.tsx b/vinoa-web/components/WineTastingCard/WineTastingCard.tsx new file mode 100644 index 0000000..403dc70 --- /dev/null +++ b/vinoa-web/components/WineTastingCard/WineTastingCard.tsx @@ -0,0 +1,26 @@ +interface WineTastingProps{ + wine:Wine; +} +export default function WineTastingCard({wine}:WineTastingProps){ + + return( +
+ +
+ {wine.tag} +
+
+

{wine.name}

+

{wine.price} NOK

+
+

Taste

{wine.taste}

+

Aroma

{wine.smell}

+

Body

{wine.body}

+
+
+
+ ) +} \ No newline at end of file diff --git a/vinoa-web/components/WineTastingCard/index.ts b/vinoa-web/components/WineTastingCard/index.ts new file mode 100644 index 0000000..8c294e4 --- /dev/null +++ b/vinoa-web/components/WineTastingCard/index.ts @@ -0,0 +1,2 @@ +import WineTastingCard from "./WineTastingCard"; +export default WineTastingCard; \ No newline at end of file diff --git a/vinoa-web/tailwind.config.js b/vinoa-web/tailwind.config.js index 6ead4ef..b6a721e 100644 --- a/vinoa-web/tailwind.config.js +++ b/vinoa-web/tailwind.config.js @@ -18,6 +18,7 @@ module.exports = { "violet-dark": "#232044", "violet-darker": "#1B183B", "violet-light": "#322E59", + "wine-red": "#8C0B0F", }, }, }, diff --git a/vinoa-web/types/Wine.ts b/vinoa-web/types/Wine.ts index 553a470..d8a4ef5 100644 --- a/vinoa-web/types/Wine.ts +++ b/vinoa-web/types/Wine.ts @@ -12,5 +12,6 @@ type Wine = { smell: string; taste: string; colour: string; + body:string; users: User[]; }; From b41ebc51cac15907dbdf23afe8e6e91c1d9caba1 Mon Sep 17 00:00:00 2001 From: Thomas McSherry <54848048+ThomasMcSherry@users.noreply.github.com> Date: Fri, 20 Oct 2023 12:40:05 +0100 Subject: [PATCH 2/6] Added 'body' to the wine schema and updated the wine-utils functions to retrieve it --- vinoa-web/app/page.tsx | 1 - vinoa-web/sanity/sanity-utils/wine-utils.ts | 3 +++ vinoa-web/sanity/schemas/wine.ts | 5 +++++ 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/vinoa-web/app/page.tsx b/vinoa-web/app/page.tsx index ef850bc..911f1fa 100644 --- a/vinoa-web/app/page.tsx +++ b/vinoa-web/app/page.tsx @@ -7,7 +7,6 @@ import { getCurrentMonthAsRange } from '@/lib/utils/helperFunctions'; export const dynamic = 'force-dynamic'; export default async function Home() { - const wines = await getWines(); const date = getCurrentMonthAsRange(); const thisMonthsWines: Wine[] = await getThisMonthsWines(date.from, date.to); diff --git a/vinoa-web/sanity/sanity-utils/wine-utils.ts b/vinoa-web/sanity/sanity-utils/wine-utils.ts index 361f43b..15dba02 100644 --- a/vinoa-web/sanity/sanity-utils/wine-utils.ts +++ b/vinoa-web/sanity/sanity-utils/wine-utils.ts @@ -14,6 +14,7 @@ export async function getWines(): Promise> { region, smell, taste, + body, price, "tag": *[_id == ^.tag._ref][0].name, }`, @@ -37,6 +38,7 @@ export async function getWine(slug: string): Promise { region, smell, taste, + body, price, "tag": *[_id == ^.tag._ref][0].name, }`, @@ -60,6 +62,7 @@ export async function getThisMonthsWines(dateFrom: string, dateTo: string) { region, smell, taste, + body, price, "tag": *[_id == ^.tag._ref][0].name, }`, diff --git a/vinoa-web/sanity/schemas/wine.ts b/vinoa-web/sanity/schemas/wine.ts index ae691ab..8de1d77 100644 --- a/vinoa-web/sanity/schemas/wine.ts +++ b/vinoa-web/sanity/schemas/wine.ts @@ -76,6 +76,11 @@ export default defineType({ title: 'Taste of Wine', type: 'string', }), + defineField({ + name: 'body', + title: 'Body of Wine', + type: 'string', + }), defineField({ name: 'users', title: 'People who tasted this wine', From d8905cc7169b2a866b9bc002f7779b0c67571c6d Mon Sep 17 00:00:00 2001 From: Thomas McSherry <54848048+ThomasMcSherry@users.noreply.github.com> Date: Fri, 20 Oct 2023 12:44:36 +0100 Subject: [PATCH 3/6] Added missing key to thisMonthsWines map --- vinoa-web/app/page.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/vinoa-web/app/page.tsx b/vinoa-web/app/page.tsx index 911f1fa..6871a6e 100644 --- a/vinoa-web/app/page.tsx +++ b/vinoa-web/app/page.tsx @@ -19,7 +19,9 @@ export default async function Home() { {thisMonthsWines.map((wine, index) =>{ return( - +
+ +
) })} From 3193d2de5ee60099fb345c208429b4abfbbadd84 Mon Sep 17 00:00:00 2001 From: Thomas McSherry <54848048+ThomasMcSherry@users.noreply.github.com> Date: Fri, 20 Oct 2023 13:56:31 +0100 Subject: [PATCH 4/6] Removed colour from wine and changed how properties are used in WineTastingCard --- vinoa-web/app/layout.tsx | 2 +- vinoa-web/app/page.tsx | 23 +++----- .../components/WineListCard/WineListCard.tsx | 4 +- .../WineTastingCard/WineTastingCard.tsx | 56 +++++++++++-------- vinoa-web/types/Wine.ts | 1 - 5 files changed, 44 insertions(+), 42 deletions(-) diff --git a/vinoa-web/app/layout.tsx b/vinoa-web/app/layout.tsx index 81959da..eb3cb1a 100644 --- a/vinoa-web/app/layout.tsx +++ b/vinoa-web/app/layout.tsx @@ -17,7 +17,7 @@ export default function RootLayout({ }) { return ( - + {children} diff --git a/vinoa-web/app/page.tsx b/vinoa-web/app/page.tsx index 6871a6e..4172574 100644 --- a/vinoa-web/app/page.tsx +++ b/vinoa-web/app/page.tsx @@ -12,21 +12,16 @@ export default async function Home() { const thisMonthsWines: Wine[] = await getThisMonthsWines(date.from, date.to); return ( -
- -
-
- {thisMonthsWines.map((wine, index) =>{ - - return( -
- -
- ) - })} -
+
+
+ {thisMonthsWines.map((wine, index) => { + return ( +
+ +
+ ); + })}
-
); } diff --git a/vinoa-web/components/WineListCard/WineListCard.tsx b/vinoa-web/components/WineListCard/WineListCard.tsx index e3674cb..5a92e06 100644 --- a/vinoa-web/components/WineListCard/WineListCard.tsx +++ b/vinoa-web/components/WineListCard/WineListCard.tsx @@ -5,7 +5,7 @@ interface WineProps { wine: Wine; } const WineListCard = ({ - wine: { name, imageUrl, country, region, colour, smell, taste, slug }, + wine: { name, imageUrl, country, region, smell, taste, body, slug }, }: WineProps) => { return ( @@ -26,7 +26,7 @@ const WineListCard = ({

Country: {country}

Region: {region}

-

Color: {colour}

+

Body: {body}

Smell: {smell}

Taste: {taste}

diff --git a/vinoa-web/components/WineTastingCard/WineTastingCard.tsx b/vinoa-web/components/WineTastingCard/WineTastingCard.tsx index 403dc70..86d8379 100644 --- a/vinoa-web/components/WineTastingCard/WineTastingCard.tsx +++ b/vinoa-web/components/WineTastingCard/WineTastingCard.tsx @@ -1,26 +1,34 @@ -interface WineTastingProps{ - wine:Wine; -} -export default function WineTastingCard({wine}:WineTastingProps){ +import Image from 'next/image'; - return( -
- -
- {wine.tag} -
-
-

{wine.name}

-

{wine.price} NOK

-
-

Taste

{wine.taste}

-

Aroma

{wine.smell}

-

Body

{wine.body}

-
-
+interface WineTastingProps { + wine: Wine; +} +export default function WineTastingCard({ + wine: { name, imageUrl, tag, price, taste, smell, body }, +}: WineTastingProps) { + return ( +
+
+ Image of a wine bottle +
+
+ {tag} +
+
+

{name}

+

{price} NOK

+
+

Taste

{taste}

+

Aroma

{smell}

+

Body

{body}

- ) -} \ No newline at end of file +
+
+ ); +} diff --git a/vinoa-web/types/Wine.ts b/vinoa-web/types/Wine.ts index d8a4ef5..812df2c 100644 --- a/vinoa-web/types/Wine.ts +++ b/vinoa-web/types/Wine.ts @@ -11,7 +11,6 @@ type Wine = { region: string; smell: string; taste: string; - colour: string; body:string; users: User[]; }; From ed635f14ee80e5461386ac9d73e86dc8b72e831a Mon Sep 17 00:00:00 2001 From: Thomas McSherry <54848048+ThomasMcSherry@users.noreply.github.com> Date: Fri, 20 Oct 2023 14:50:44 +0100 Subject: [PATCH 5/6] Vertically centered wine cards on home page --- vinoa-web/app/page.tsx | 20 ++++++++++--------- .../components/Navigation/Navigation.tsx | 2 +- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/vinoa-web/app/page.tsx b/vinoa-web/app/page.tsx index 4172574..2d29a97 100644 --- a/vinoa-web/app/page.tsx +++ b/vinoa-web/app/page.tsx @@ -12,15 +12,17 @@ export default async function Home() { const thisMonthsWines: Wine[] = await getThisMonthsWines(date.from, date.to); return ( -
-
- {thisMonthsWines.map((wine, index) => { - return ( -
- -
- ); - })} +
+
+
+ {thisMonthsWines.map((wine, index) => { + return ( +
+ +
+ ); + })} +
); diff --git a/vinoa-web/components/Navigation/Navigation.tsx b/vinoa-web/components/Navigation/Navigation.tsx index a5fd187..ef1caa1 100644 --- a/vinoa-web/components/Navigation/Navigation.tsx +++ b/vinoa-web/components/Navigation/Navigation.tsx @@ -6,7 +6,7 @@ import { usePathname } from 'next/navigation'; const Navigation = () => { const path = usePathname(); return ( -