From e0ea28431b10192a0ec447ddfd0ad6a1a7a97fd5 Mon Sep 17 00:00:00 2001 From: ginifizz Date: Fri, 17 May 2024 14:35:16 +0200 Subject: [PATCH] feat: add modal con --- pwa/app/(common)/components/ModalCon.tsx | 115 ++++++++++++ pwa/app/(common)/layout.tsx | 2 + .../[locale]/con/2024/components/HomePage.tsx | 4 +- pwa/components/layout/Nav.tsx | 6 +- pwa/components/layout/Preheader.tsx | 169 +++++++----------- .../conferences/artisanal-api-platform.md | 6 +- .../conferences/artisinal-api-platform.md | 18 ++ pwa/package.json | 4 +- pwa/pnpm-lock.yaml | 24 +++ 9 files changed, 234 insertions(+), 114 deletions(-) create mode 100644 pwa/app/(common)/components/ModalCon.tsx create mode 100644 pwa/data/con/2024/conferences/artisinal-api-platform.md diff --git a/pwa/app/(common)/components/ModalCon.tsx b/pwa/app/(common)/components/ModalCon.tsx new file mode 100644 index 000000000..1b30b11b5 --- /dev/null +++ b/pwa/app/(common)/components/ModalCon.tsx @@ -0,0 +1,115 @@ +"use client"; +import Button from "components/common/Button"; +import classNames from "classnames"; +import Web from "components/con/common/Web"; +import { useState, useEffect, useRef } from "react"; + +export default function ModalCon() { + const [open, setOpen] = useState(false); + const modal = useRef(null); + + useEffect(() => { + const handleClickOutside = (event: MouseEvent) => { + if (modal.current && !modal.current.contains(event.target as Node)) { + setOpen(false); + } + }; + + document.addEventListener("mousedown", handleClickOutside); + + return () => { + document.removeEventListener("mousedown", handleClickOutside); + }; + }, []); + + useEffect(() => { + let timeout: any; + const storedDate = localStorage.getItem("modal-con-schedule"); + if ( + !storedDate || + Date.now() - parseInt(storedDate, 10) > 1 * 24 * 60 * 60 * 1000 // 1 jour + ) { + timeout = setTimeout(() => { + setOpen(true); + localStorage.setItem("modal-con-schedule", Date.now().toString()); + }, 4000); + } + + return () => timeout && clearTimeout(timeout); + }, [setOpen]); + + return ( +
+
+
+ + API Platform Conference +
+ September 19-20, 2024 | Lille & online +
+ +
+
+
+

+ The international conference on the API Platform Framework +

+

+ API Platform Conference 2024: meet the best PHP, JavaScript and + API experts +

+

+ Learn more about the event, register for the + conference, and get ready for two days of inspiration, ideas, and + knowledge-sharing with our incredible lineup of renowned + specialists and advocates. +

+ +
+
+
+
+ ); +} diff --git a/pwa/app/(common)/layout.tsx b/pwa/app/(common)/layout.tsx index 1524d1054..224c76457 100644 --- a/pwa/app/(common)/layout.tsx +++ b/pwa/app/(common)/layout.tsx @@ -4,6 +4,7 @@ import { Poppins, Fira_Mono } from "next/font/google"; import Layout from "components/layout/Layout"; import { Metadata } from "next"; import { getRootUrl } from "utils"; +import ModalCon from "./components/ModalCon"; const poppins = Poppins({ variable: "--font-poppins", @@ -68,6 +69,7 @@ function RootLayout({ className={`${poppins.variable} ${fira.variable} w-full light`} > + {children} diff --git a/pwa/app/(con)/[locale]/con/2024/components/HomePage.tsx b/pwa/app/(con)/[locale]/con/2024/components/HomePage.tsx index c3b92dafc..8206919f6 100644 --- a/pwa/app/(con)/[locale]/con/2024/components/HomePage.tsx +++ b/pwa/app/(con)/[locale]/con/2024/components/HomePage.tsx @@ -276,8 +276,8 @@ const HomePage = ({ speakers, partners, images }: HomePageProps) => { }} /> - - {speakers.length > 6 ? ( + + {speakers.length > 9 ? ( diff --git a/pwa/components/layout/Nav.tsx b/pwa/components/layout/Nav.tsx index fc7b7eab0..43fad8b62 100644 --- a/pwa/components/layout/Nav.tsx +++ b/pwa/components/layout/Nav.tsx @@ -55,11 +55,7 @@ export default function Nav({ withPreheader = false }) { "left-0 w-full absolute z-50", withBg && "bg-white dark:bg-blue-darkest shadow-md", isDocPage ? "sticky" : "absolute", - withPreheader && !isDocPage - ? withRyanHeader - ? "top-16 md:top-20" - : "top-16" - : "top-0" + withPreheader && !isDocPage ? "top-16" : "top-0" )} >
- {/* + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Api Platform conference -
-

- The conference dedicated to API Platform and its ecosystem -

-
- Sep 19, 20 2024 | Lille & - online -
-
- -
- */} - -
- -
-

- Ryan Weaver{" "} - - (author of the API Platform screencasts and long-time - contributor){" "} - - and his family need our help! -

-

- Please consider making a donation now to support them. -

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Api Platform conference +
+

+ The conference dedicated to API Platform and its ecosystem +

+
+ Sep 19, 20 2024 | Lille & + online
-
- - + +
+ ); } diff --git a/pwa/data/con/2024/conferences/artisanal-api-platform.md b/pwa/data/con/2024/conferences/artisanal-api-platform.md index e45392655..f317bf227 100644 --- a/pwa/data/con/2024/conferences/artisanal-api-platform.md +++ b/pwa/data/con/2024/conferences/artisanal-api-platform.md @@ -9,10 +9,10 @@ short: Using API Platform with Laravel. tag: --- -# Artisanal API Platform (🇺🇸) +# Artisinal API Platform (🇺🇸) -Join me at the API Platform Conference for an insight into how to make the API Platform more "artisanal". By this, I mean we are going to explore how we can **use API Platform within a Laravel application**, and how we can lean on API Platform to craft robust APIs. We will delve into practical strategies, demonstrating how you can leverage the strengths of both frameworks to enhance your API development. +Join me at the API Platform Conference for an insight into how to make the API Platform more "artisinal". By this, I mean we are going to explore how we can **use API Platform within a Laravel application**, and how we can lean on API Platform to craft robust APIs. We will delve into practical strategies, demonstrating how you can leverage the strengths of both frameworks to enhance your API development. From this talk you will gain insights into setting up API Platform within a Laravel environment, optimizing the API performance, and implementing some best practices to ensure scalability and security. -Whether you're a seasoned Laravel developer eager to expand your API toolkit, or new to API Platform, this talk will equip you with **the knowledge you need** to illuminate your next API Platform project. \ No newline at end of file +Whether you're a seasoned Laravel developer eager to expand your API toolkit, or new to API Platform, this talk will equip you with **the knowledge you need** to illuminate your next API Platform project. diff --git a/pwa/data/con/2024/conferences/artisinal-api-platform.md b/pwa/data/con/2024/conferences/artisinal-api-platform.md new file mode 100644 index 000000000..f317bf227 --- /dev/null +++ b/pwa/data/con/2024/conferences/artisinal-api-platform.md @@ -0,0 +1,18 @@ +--- +type: conference +speakers: -steve-mcdougall-2024 +track: +date: +start: +end: +short: Using API Platform with Laravel. +tag: +--- + +# Artisinal API Platform (🇺🇸) + +Join me at the API Platform Conference for an insight into how to make the API Platform more "artisinal". By this, I mean we are going to explore how we can **use API Platform within a Laravel application**, and how we can lean on API Platform to craft robust APIs. We will delve into practical strategies, demonstrating how you can leverage the strengths of both frameworks to enhance your API development. + +From this talk you will gain insights into setting up API Platform within a Laravel environment, optimizing the API performance, and implementing some best practices to ensure scalability and security. + +Whether you're a seasoned Laravel developer eager to expand your API toolkit, or new to API Platform, this talk will equip you with **the knowledge you need** to illuminate your next API Platform project. diff --git a/pwa/package.json b/pwa/package.json index 24ae35333..397dc353f 100644 --- a/pwa/package.json +++ b/pwa/package.json @@ -25,6 +25,7 @@ "@types/http-headers": "^3.0.0", "@types/swagger-ui": "^3.52.0", "classnames": "^2.3.2", + "cookies-next": "^4.1.1", "dayjs": "^1.11.9", "dotenv": "^16.3.1", "gray-matter": "^4.0.3", @@ -86,5 +87,6 @@ "peerDependencies": { "@babel/core": "^7.19.0", "@popperjs/core": "^2.11.6" - } + }, + "packageManager": "pnpm@9.1.1+sha512.14e915759c11f77eac07faba4d019c193ec8637229e62ec99eefb7cf3c3b75c64447882b7c485142451ee3a6b408059cdfb7b7fa0341b975f12d0f7629c71195" } diff --git a/pwa/pnpm-lock.yaml b/pwa/pnpm-lock.yaml index 09b7dd466..9cb6f12ef 100644 --- a/pwa/pnpm-lock.yaml +++ b/pwa/pnpm-lock.yaml @@ -41,6 +41,9 @@ dependencies: classnames: specifier: ^2.3.2 version: 2.3.2 + cookies-next: + specifier: ^4.1.1 + version: 4.1.1 dayjs: specifier: ^1.11.9 version: 1.11.9 @@ -2877,6 +2880,10 @@ packages: resolution: {integrity: sha512-wJsiX1tosQ+J5+bY5LrSahHxr2wT+uME5UDwdN1kg4frt40euqA+wzECkmq4t5QbveHiJepfdThgQrPw6KiSlg==} dev: false + /@types/cookie@0.6.0: + resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==} + dev: false + /@types/debug@4.1.8: resolution: {integrity: sha512-/vPO1EPOs306Cvhwv7KfVfYvOJqA/S/AXjaHQiJboCZzcNDb+TIJFN9/2C9DZ//ijSKWioNyUxD792QmDJ+HKQ==} dependencies: @@ -2998,6 +3005,10 @@ packages: resolution: {integrity: sha512-c4mvXFByghezQ/eVGN5HvH/jI63vm3B7FiE81BUzDAWmuiohRecCO6ddU60dfq29oKUMiQujsoB2h0JQC7JHKA==} dev: true + /@types/node@16.18.97: + resolution: {integrity: sha512-4muilE1Lbfn57unR+/nT9AFjWk0MtWi5muwCEJqnOvfRQDbSfLCUdN7vCIg8TYuaANfhLOV85ve+FNpiUsbSRg==} + dev: false + /@types/node@18.17.14: resolution: {integrity: sha512-ZE/5aB73CyGqgQULkLG87N9GnyGe5TcQjv34pwS8tfBs1IkCh0ASM69mydb2znqd6v0eX+9Ytvk6oQRqu8T1Vw==} @@ -3993,6 +4004,19 @@ packages: engines: {node: '>= 0.6'} dev: false + /cookie@0.6.0: + resolution: {integrity: sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==} + engines: {node: '>= 0.6'} + dev: false + + /cookies-next@4.1.1: + resolution: {integrity: sha512-20QaN0iQSz87Os0BhNg9M71eM++gylT3N5szTlhq2rK6QvXn1FYGPB4eAgU4qFTunbQKhD35zfQ95ZWgzUy3Cg==} + dependencies: + '@types/cookie': 0.6.0 + '@types/node': 16.18.97 + cookie: 0.6.0 + dev: false + /copy-to-clipboard@3.3.3: resolution: {integrity: sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==} dependencies: