feat: menua eguneratzen du (#10)

* feat: menua eguneratzen du

* ignore: komentarioa
This commit is contained in:
Aitor Urrutia
2023-12-19 19:15:31 +01:00
committed by GitHub
parent 8e76a416d9
commit cbdfd68d67
10 changed files with 159 additions and 361 deletions

View File

@@ -1,2 +1,3 @@
GATSBY_ROOT_URL=https://laba-webgunea.netlify.app
API_URL=https://vervet-big-dassie.ngrok-free.app
STRAPI_GRAPHQL_TOKEN=307442ef6911b9692d6946bf6aac5d910795b56d92063e8a58ace14e31c8ac6ad7b64480ba591689abbad02758da9562e423e1ef1af8b9f303612ffb63f94f567060ea9f690d9d14bce676bdcf985a2a8c95643963ffd6f593490bb4b4ccae51572cbf315e7c823d0f368de2fe113b113986e9943df1a81e6e4228b82cc7cead

View File

@@ -15,20 +15,14 @@ import { useKafetegiaData } from '../viewQueries/useKafetegiaData';
import { AlergenoLegenda } from '../components/AlergenoLegenda';
import { Oina } from '../components/Oina';
import { SEO } from '../components/SEO';
import { produktuaFactory } from '../domain/factories/produktuaFactory';
const Kafetegia: React.VFC<PageProps> = ({ location }) => {
const {
izenburua,
deskribapena,
anizkoJogurta,
edariBeroak,
edariHotzak,
infusioEkologikoak,
pikatzekoak,
gozoak,
tostadak,
konboak,
} = useKafetegiaData();
const { izenburua, deskribapena, menua } = useKafetegiaData();
// oraingoz menuak alergenorik ez duenez, ezkutatuko dugu
// TODO modu dinamikoan aldatu balio hau
const hasAlergenoak = false;
return (
<>
@@ -47,80 +41,47 @@ const Kafetegia: React.VFC<PageProps> = ({ location }) => {
<ContentWrapper id="edukia">
<Container>
<TaldeWrapper>
<IzenburuWrapper>
<Marra />
<Izenburua>Edariak</Izenburua>
</IzenburuWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda
izena="Edari beroak"
produktuZerrenda={edariBeroak}
/>
</ZerrendaWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda
izena="Infusio ekologikoak"
produktuZerrenda={infusioEkologikoak}
/>
</ZerrendaWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda
izena="Edari hotzak"
produktuZerrenda={edariHotzak}
/>
</ZerrendaWrapper>
</TaldeWrapper>
{menua.map(konponentea => {
if (
konponentea.konponentea ===
'StrapiComponentKafetegiaProduktuTaldea'
) {
return (
<>
<ZerrendaWrapper>
<ProduktuZerrenda
izena={konponentea.izenburua}
produktuZerrenda={konponentea.produktuak.map(
produktuaFactory,
)}
/>
</ZerrendaWrapper>
</>
);
}
<TaldeWrapper>
<IzenburuWrapper>
<Marra />
<Izenburua>Jakiak</Izenburua>
</IzenburuWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda
izena="Pikatzekoak"
produktuZerrenda={pikatzekoak}
/>
</ZerrendaWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda izena="Tostadak" produktuZerrenda={tostadak} />
</ZerrendaWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda izena="Gozoak" produktuZerrenda={gozoak} />
</ZerrendaWrapper>
<ZerrendaWrapper>
<ProduktuZerrenda
izena="Anizko Jogurta"
produktuZerrenda={[anizkoJogurta]}
/>
</ZerrendaWrapper>
</TaldeWrapper>
</Container>
if (
konponentea.konponentea === 'StrapiComponentKafetegiaIzenburua'
) {
return (
<IzenburuWrapper>
<Marra />
<Izenburua>{konponentea.izenburuBalioa}</Izenburua>
</IzenburuWrapper>
);
}
})}
<KonboWrapper>
<Container>
<IzenburuWrapper>
<Marra />
<Izenburua>GOSARI KONBOAK</Izenburua>
</IzenburuWrapper>
<KonboAzalpena>
11:00ak arte. Gehitu hauetako bat zure tostada, pintxo edo
bizkotxoari.
</KonboAzalpena>
<ProduktuZerrenda produktuZerrenda={konboak} />
</Container>
</KonboWrapper>
{hasAlergenoak && (
<TaldeWrapper>
<IzenburuWrapper>
<Marra />
<Izenburua>Alergenoak</Izenburua>
</IzenburuWrapper>
<Container>
<TaldeWrapper>
<IzenburuWrapper>
<Marra />
<Izenburua>Alergenoak</Izenburua>
</IzenburuWrapper>
<AlergenoLegenda />
</TaldeWrapper>
<AlergenoLegenda />
</TaldeWrapper>
)}
<OnEgin>
<p>On egin!</p>
@@ -133,18 +94,6 @@ const Kafetegia: React.VFC<PageProps> = ({ location }) => {
);
};
const KonboAzalpena = styled.p`
margin-bottom: ${size.base}px;
text-align: right;
`;
const KonboWrapper = styled.div`
background-color: ${colors.horia};
padding-top: ${size.base}px;
padding-bottom: ${size.base}px;
margin-bottom: ${size.large}px;
`;
const OnEgin = styled.div`
text-align: center;
${font.gargantuan()};

View File

@@ -1,14 +1,7 @@
import { Produktua } from '../domain/models/Produktua';
import { MenuKonponentea } from './useKafetegiaData';
export interface KafetegiaData {
deskribapena: string;
izenburua: string;
edariBeroak: Produktua[];
infusioEkologikoak: Produktua[];
edariHotzak: Produktua[];
pikatzekoak: Produktua[];
gozoak: Produktua[];
anizkoJogurta: Produktua;
tostadak: Produktua[];
konboak: Produktua[];
menua: MenuKonponentea[];
}

View File

@@ -1,223 +1,64 @@
import { graphql, useStaticQuery } from 'gatsby';
import { ProduktuaDTO } from '../domain/dtos/ProduktuaDTO';
import { produktuaFactory } from '../domain/factories/produktuaFactory';
import { KafetegiaData } from './KafetegiaData';
export type MenuKonponentea =
| {
konponentea: 'StrapiComponentKafetegiaIzenburua';
izenburuBalioa: string;
}
| {
konponentea: 'StrapiComponentKafetegiaProduktuTaldea';
izenburua: string;
produktuak: ProduktuaDTO[];
};
interface DataProps {
strapiKafetegia: {
deskribapena: string;
izenburua: string;
edariBeroak: ProduktuaDTO[];
infusioEkologikoak: ProduktuaDTO[];
edariHotzak: ProduktuaDTO[];
pikatzekoak: ProduktuaDTO[];
gozoak: ProduktuaDTO[];
anizkoJogurta: ProduktuaDTO;
tostadak: ProduktuaDTO[];
konboak: ProduktuaDTO[];
menua: MenuKonponentea[];
};
}
export function useKafetegiaData(): KafetegiaData {
const {
strapiKafetegia: {
izenburua,
deskribapena,
anizkoJogurta,
edariBeroak,
edariHotzak,
infusioEkologikoak,
pikatzekoak,
gozoak,
tostadak,
konboak,
},
strapiKafetegia: { izenburua, deskribapena, menua },
} = useStaticQuery<DataProps>(graphql`
{
strapiKafetegia {
izenburua
deskribapena
anizkoJogurta {
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
menua {
konponentea: __typename
... on StrapiComponentKafetegiaIzenburua {
izenburuBalioa
id
}
beganoa
ekologikoa
izena
prezioa
}
edariBeroak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
edariHotzak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
infusioEkologikoak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
pikatzekoak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
gozoak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
tostadak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
konboak {
id
ekologikoa
beganoa
izena
prezioa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
... on StrapiComponentKafetegiaProduktuTaldea {
izenburua
produktuak {
izena
prezioa
beganoa
ekologikoa
alergenoak {
apioa
arraina
arrautzak
esnekiak
fruituLehorrak
glutena
kakahueteak
krustazeoak
lupinuak
moluskuak
sesamoa
soja
sulfitoak
ziapea
}
}
}
}
}
@@ -227,13 +68,6 @@ export function useKafetegiaData(): KafetegiaData {
return {
izenburua,
deskribapena,
anizkoJogurta: produktuaFactory(anizkoJogurta),
edariBeroak: edariBeroak.map(produktuaFactory),
edariHotzak: edariHotzak.map(produktuaFactory),
infusioEkologikoak: infusioEkologikoak.map(produktuaFactory),
pikatzekoak: pikatzekoak.map(produktuaFactory),
gozoak: gozoak.map(produktuaFactory),
tostadak: tostadak.map(produktuaFactory),
konboak: konboak.map(produktuaFactory),
menua,
};
}