Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add fetching #195

Merged
merged 1 commit into from
Jul 24, 2024
+71 −211
Merged

feat: add fetching #195

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
219 changes: 34 additions & 185 deletions next-app/app/partners/page.tsx
View file
Open in desktop
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
Open in desktop
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
Loading