feat: implement resume printing system

README.md

@@ -15,9 +15,9 @@ This project is available for free as a proof of concept and source of inspirati
 This app uses several environment variables to configure the API url, Google Analytics tracking ID and Web3forms access key. You can create a `.env.local` file in the root directory with the following content:
 
 ```shell
-REACT_APP_API_URL=https://localhost:3001 # The URL of the backend
-REACT_APP_GOOGLE_ANALYTICS_ID=UA-XXXXXXXXX-X # Your google Analytics tracking ID
-REACT_APP_WEB3FORMS_KEY=XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX # Your web3forms access key
+VITE_API_URL=https://localhost:3001 # The URL of the backend
+VITE_GOOGLE_ANALYTICS_ID=UA-XXXXXXXXX-X # Your google Analytics tracking ID
+VITE_WEB3FORMS_KEY=XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX # Your web3forms access key
 ```
 
 To run the app locally, you need to have Node.js and yarn installed on your machine. Clone this repository and run the following commands in the root directory:
@@ -33,7 +33,7 @@ In its default configuration, the app should be available at http://localhost:30
 
 For detailed documentation on how to run the backend, please refer to the [api.bsodium.fr](https://github.com/BSoDium/api.bsodium.fr) repository.
 
-By default, the backend is expected to run on `http://localhost:3001`. If you decide to change this, you should also modify the `REACT_APP_API_URL` environment variable in the `.env.local` file accordingly.
+By default, the backend is expected to run on `http://localhost:3001`. If you decide to change this, you should also modify the `VITE_API_URL` environment variable in the `.env.local` file accordingly.
 
 ## License
 

package.json

@@ -16,11 +16,11 @@
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.13.0",
     "@mui/joy": "5.0.0-alpha.85",
-    "@react-hook/size": "^2.1.2",
     "@react-spring/web": "^9.7.3",
     "@types/color": "^3.0.3",
     "@vercel/speed-insights": "^1.0.12",
     "axios": "^1.6.5",
+    "jspdf": "^2.5.1",
     "marked": "^13.0.2",
     "moment": "^2.29.4",
     "react": "^18.3.1",

src/components/AnalyticsBanner.tsx

@@ -1,12 +1,15 @@
 import { Button, Card, Stack, Typography } from "@mui/joy";
 import { animated, useSpringRef, useTransition } from "@react-spring/web";
+import useOverlayQueryParam from '@/navigation/useOverlayQueryParam';
 import { useEffect, useState } from "react";
 
 export default function AnalyticsBanner() {
   const [isDimissed, setIsDimissed] = useState(
     localStorage.getItem("analyticsBannerDismissed") === "true"
   );
 
+  const hidden = useOverlayQueryParam();
+
   const transitionRef = useSpringRef();
 
   const transition = useTransition(isDimissed, {
@@ -35,10 +38,11 @@ export default function AnalyticsBanner() {
         component={animated.div}
         variant="outlined"
         sx={(theme) => ({
-          position: "fixed",
-          bottom: "var(--nav-safe-area-inset-bottom, 0)",
-          marginBottom: "1rem",
-          left: "50%",
+          display: hidden ? 'none' : 'flex',
+          position: 'fixed',
+          bottom: 'var(--nav-safe-area-inset-bottom, 0)',
+          marginBottom: '1rem',
+          left: '50%',
           backgroundColor: theme.palette.background.body,
           zIndex: 1000,
           width: "min(100% - 2rem, 45rem)",

src/components/Copyright.tsx

@@ -1,5 +1,6 @@
 import { Card, Link, Typography } from "@mui/joy";
 import { animated } from "@react-spring/web";
+import useOverlayQueryParam from '@/navigation/useOverlayQueryParam';
 import { useMobileMode } from "@/components/Responsive";
 
 /**
@@ -17,6 +18,8 @@ import { useMobileMode } from "@/components/Responsive";
 export default function Copyright() {
   const mobile = useMobileMode();
 
+  const hidden = useOverlayQueryParam();
+
   const isAuthorDomain = ["bsodium.fr", "www.bsodium.fr"].includes(
     window.location.hostname
   );
@@ -30,8 +33,8 @@ export default function Copyright() {
         right: "0",
         width: mobile ? "100vw" : undefined,
         zIndex: 1000,
-        display: "flex",
-        flexDirection: "row",
+        display: hidden ? 'none' : 'flex',
+        flexDirection: 'row',
         borderRadius: 0,
         borderBottomLeftRadius: mobile ? undefined : "1rem",
         padding: "0.5rem 1rem",