Skip to content

Commit

Permalink
feat: add fetching
Browse files Browse the repository at this point in the history
  • Loading branch information
@YoanRos
YoanRos committed Jul 24, 2024
1 parent 0dac869 commit 236afd4
Show file tree
Hide file tree
Showing 2 changed files with 71 additions and 211 deletions.
219 changes: 34 additions & 185 deletions next-app/app/partners/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,215 +1,64 @@
import Footer from "~/components/Footer"
import Navigation from "~/components/Navigation"
import { fetchAPI, getStrapiMedia } from "~/app/api/strapi"
import { Key} from "react";

export const metadata = {
title: "Partenaires | Oz Ensemble",
description:
"Découvrez les partenaires d'Oz Ensemble, une application mobile pour maitriser sa consommation d'alcool.",
}

export default function Partners() {
async function getPartners() {
try {
const path = `/partners-page`;
const urlParamsObject = {
populate: ["section", "section.logos", "section.logos.image"],
};
const options = {};
const { data } = await fetchAPI(path, urlParamsObject, options);
return data?.attributes;
} catch (error) {
console.error(error);
return [];
}
}

export default async function Partners() {
const partners = await getPartners();
return (
<div className="mt-[70px]">
<Navigation />
<div className="mt-30 lg:mt-40">
<h1 className="mb-2 text-3xl text-center font-extrabold lg:text-5xl text-oz-blue">
Ils parlent de nous
{partners?.title || "Ils parlent de nous"}
</h1>
<div className="px-20 lg:py-10">
{partners?.section?.map((section: { id: Key; title: string; logos: any[]; }) => (
<div key={section.id} className="px-20 lg:py-10">
<h3 className="text-2xl font-bold lg:text-4xl text-oz-green">
Institutions
{section.title}
</h3>
<div className="flex flex-wrap mt-10 gap-10 ">
<div className="transition duration-500 hover:scale-110 basis-1/6">
<div className="flex items-center flex-wrap mt-10 gap-10 ">
{section.logos?.map((logo)=>(
<div key={logo.id} className="transition duration-500 hover:scale-110 basis-1/6">
<a
className=""
href="https://www.alcool-info-service.fr/Actualites/Oz-ensemble-une-application-pour-maitriser-sa-consommation-d-alcool"
href={logo.url}
>
<img
className="pt-8"
src="images/logo_alcool_info_service.png"
alt="Partenaire alcool info service, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://www.federationaddiction.fr/actualites/oz-ensemble-une-application-pour-smartphone-pour-reprendre-la-maitrise-de-sa-consommation-dalcool/">
<img
className="pt-7"
src="images/logo_federation_addiction.png"
alt="Partenaire fédération addiction, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-32">
<a href="https://www.ars.sante.fr/">
<img
className=""
src="images/logo_ars.png"
alt="Partenaire l'agence régionale de santé Ile-de-France, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-40">
<a href="https://capasscite.fr/association/">
<img
className=""
src="images/logo_CaPASSCite.png"
alt="Partenaire l'association Capasscité, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
</div>
</div>
<div className="px-20 py-20 lg:py-10">
<h3 className="text-2xl font-bold lg:text-4xl text-oz-green">
Communes
</h3>
<div className="flex flex-wrap mt-10 gap-10 ">
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://correns.fr/fr/nw/1870442/1732031/dispositif-oz-ensemble">
<img
className=""
src="images/logo_correns.png"
alt="La commune de Correns, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110">
<a href="https://www.mairie-jury.fr/a-la-une/une-861/oz-le-dispositif-du-ministere-de-la-sante-en-addictologie-5326.html">
<img
className=""
src="images/logo_jury.png"
alt="Commune jury, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110">
<a href="https://mairie-martressurmorge.fr/2023/10/18/oz-ensemble-maitriser-sa-consommation-dalcool/">
<img
className=""
src="images/logo_martres_sur_morge.png"
alt="Commune les martres sur morge, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-32">
<a href="https://www.intramuros.org/laa-mondrans/actualites/321342">
<img
className=""
src="images/logo_laa_mondrans.jpg"
alt="Commune Laà Mondras , accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://gps.gf/agenda/presentation-de-l-application-oz-ensemble/">
<img
className=""
src="images/logo_guyane_promo_sante.png"
alt="L'association guyane promo santé, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://ouzouersurloire.fr/application-mobile-oz-ensemble ">
<img
className=""
src="images/logo_ouzouer.png"
alt="La commune ouzouer-sur-loire, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://villeneuvelesbouloc.fr/fr/nw/1326795/1651652/application-oz-ensemble">
<img
className=""
src="images/logo_villeneuve_les_bouloc.jpg"
alt="Partenaire fédération addiction, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
</div>
</div>
<div className="px-20 py-20 lg:py-10">
<h3 className="text-2xl font-bold lg:text-4xl text-oz-green">
Autres
</h3>
<div className="flex flex-wrap mt-10 gap-10 ">
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://www.whatsupdoc-lemag.fr/article/quarantaine-confinement-une-app-oz-ensemble-aide-au-controle-de-la-consommation-dalcool">
<img
className=""
src="images/logo_whatsupdoc.png"
alt="Magazine what's up doc, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/12">
<a href="https://apps.apple.com/app/id1443535001">
<img
className=""
src="images/logo_nutri_app.png"
alt="Application nutri app, accédez à la page de téléchargement en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://www.ordotype.fr/recommandations/sevrage-alcoolique-application-oz-ensemble">
<img
className=""
src="images/logo_ordotype.svg"
alt="Le site internet ordotype, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://www.lanutrition.fr/dry-january-quels-bienfaits-en-attendre-pour-la-sante">
<img
className=""
src="images/logo_la_nutrition.svg"
alt="Journal la nutrition, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://app.vivatechnology.com/partner/2d36f8bb-2201-ee11-907a-002248859577/oz-ensemble">
<img
className=""
src="images/logo_viva_technology.png"
alt="Entreprise VIVA technology, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
</div>
</div>
<div className="px-20 py-20 lg:py-10">
<h3 className="text-2xl font-bold lg:text-4xl text-oz-green">
Presse
</h3>
<div className="flex flex-wrap my-10 gap-10 ">
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://rmc.bfmtv.com/conso/dry-january-maitrisez-votre-consommation-d-alcool-grace-a-ces-applications_AN-202401020669.html">
<img
className=""
src="images/logo_rmc_conso.svg"
alt="Journal rmc conso, accédez à leur site en cliquant sur ce logo"
/>
</a>
</div>
<div className="transition duration-500 hover:scale-110 basis-1/6">
<a href="https://www.liberation.fr/lifestyle/gastronomie/dry-january-questionner-sa-consommation-dalcool-sur-la-duree-20230131_M6DBQPJS4VALHIKGNUPSS7KIHA/">
<img
className=""
src="images/logo_liberation.svg"
alt="Journal libération, accédez à leur site en cliquant sur ce logo"
src={getStrapiMedia(logo.image.data?.attributes.url) || ""}
alt={logo.image.data?.attributes.alternativeText || ""}
height={120}
width={120}
/>
</a>
</div>
))}
</div>
</div>
))}
</div>
<Footer />
</div>
)
}
)}
63 changes: 37 additions & 26 deletions next-app/app/plan/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,45 +4,56 @@ export const metadata = {
title: "Plan du site | Oz Ensemble",
description: "Plan du site de l'application Oz Ensemble",
}
import { fetchAPI } from "~/app/api/strapi";

export default function Plan() {

export default async function Plan() {
const data = await getData();
return (
<div className="mt-[70px]">
<Navigation />
<div className="mt-30 lg:mt-40">
<h1 className="mb-2 text-3xl text-center font-extrabold lg:text-5xl text-oz-blue">
Plan du site
<h1 className="mb-2 text-3xl text-center font-extrabold lg:text-5xl text-oz-blue"> {data?.title || "Plan du site"}
</h1>
<div className="flex flex-col gap-9 pl-40 py-12">
<ArrowList text="Accueil" link="/" />
<div className="flex flex-col gap-6 px-12">
<SubArrowList text="Comment ça marche ?" link="/#how-it-works" />
<SubArrowList text="Qui sommes-nous ?" link="/#who-are-we" />
</div>
<ArrowList text="Blog" link="/blog" />
<ArrowList text="Ils parlent de nous" link="/partners" />
<h3 className="text-2xl text-[#115F3D]">Utilités</h3>
<div className="flex flex-col gap-6 px-12">
<SubArrowList
text="Mentions légales"
link="/files/25012023-Oz_Ensemble-Mentions_legales_site_V2.pdf"
/>
<SubArrowList
text="Politique de confidentialité"
link="/files/25012023-Oz_Ensemble-Politique_de_confidentialite_site_V3.pdf"
/>
<SubArrowList text="Statistiques" link="/stats" />
<SubArrowList
text="Accessibilité : non conforme"
link="/accessibility"
/>
</div>
{ data?.sections?.map((section)=> (
<>
{ section.parentUrl ?
<ArrowList key={section.id} text={section.title} link={section.parentUrl} />
: <h3 key={section.id} className="text-2xl text-[#115F3D]">{section.title}</h3>
}
{ section.urls?.length > 0 &&
<div className="flex flex-col gap-6 px-12">
{section.urls.map((link)=>(
<SubArrowList key={link.id} text={link.title} link={link.url} />
))}
</div>
}
</>
))}

</div>
</div>
<Footer />
</div>
)
}

async function getData() {
try {
const path = `/plan-page`;
const urlParamsObject = {
populate: ["sections", "sections.urls"],
};
const options = {};
const { data } = await fetchAPI(path, urlParamsObject, options);
console.log(data);
return data?.attributes;
} catch (error) {
console.error(error);
return [];
}
}
const ArrowList = ({ text, link }) => (
<div className="mb-2 items-start">
<a href={link}>
Expand Down

0 comments on commit 236afd4

Please sign in to comment.