diff --git a/README.md b/README.md index 78c375d..8e1bcd0 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ `npm i` `npm run dev` -###### prerequisits +###### prerequisites It's recommended to use [volta](https://docs.volta.sh/guide/getting-started) ``` @@ -53,4 +53,24 @@ _meta.en-US.json At the moment the i18n is done manually by the nextra guide - https://nextra.site/docs/guide/i18n -We'll explore the option to use Crowdin instead. \ No newline at end of file +We'll explore the option to use Crowdin instead. + +### Build & Deployment + +The build and deployments are automatic on merge. + +In order to deploy it to dev/acc, merge to `develop` branch. + +For production release you need to merge to `main` branch. +For proper redeployment make sure you bump the version on every merge to main. + +Use the following: +``` +npm version patch +``` +this will bump the patch version and make a commit (e.g. 0.0.1 -> 0.0.2). + +Or manually update the npm version in the package.json file. +Then run `npm install` and commit the changes. + +Once merged into `main`, make sure to merge `main` back to `develop` (to sync the version). \ No newline at end of file diff --git a/components/iframeCommunication.js b/components/iframeCommunication.js new file mode 100644 index 0000000..70a0469 --- /dev/null +++ b/components/iframeCommunication.js @@ -0,0 +1,75 @@ +import { useEffect, useRef } from 'react'; +import { useRouter } from 'next/router'; + +const allowedOrigins = ['https://alkem.io', 'https://dev-alkem.io', 'https://acc-alkem.io', 'https://sandbox-alkem.io', 'http://localhost:3000']; +const isOriginValid = (origin) => allowedOrigins.includes(origin); + +const getCurrentOrigin = () => { + const { protocol, hostname, origin, port } = window.location; + if (port) { + return `${protocol}//${hostname}:3000`; // local client port + } + + return origin; +}; + +const sendMessageToParent = (message) => { + try { + const origin = getCurrentOrigin(); + + if (!isOriginValid(origin)) { + console.warn('Invalid origin: ', origin); + return; + } + + window.parent.postMessage(message, getCurrentOrigin()); + } catch (error) { + console.warn('Failed to send message to parent: ', error); + } +}; + +const SupportedMessageTypes = { + PageHeight: 'PAGE_HEIGHT', + PageChange: 'PAGE_CHANGE', +}; + +const IframeCommunication = () => { + const router = useRouter(); + const lastHeight = useRef(0); + const debounceTimeout = useRef(null); + + const sendPageHeight = () => { + const pageHeight = document.documentElement.scrollHeight || document.body.scrollHeight; + + // Only send if there's a meaningful difference in height + if (Math.abs(pageHeight - lastHeight.current) > 40) { + lastHeight.current = pageHeight; + + // Debounce the message to avoid excessive calls + clearTimeout(debounceTimeout.current); + debounceTimeout.current = setTimeout(() => { + sendMessageToParent({ type: SupportedMessageTypes.PageHeight, height: pageHeight }); + }, 50); + } + }; + + useEffect(() => { + // Send initial page height and path + sendMessageToParent({ type: SupportedMessageTypes.PageChange, url: router.pathname }); + sendPageHeight(); + + // Observe changes to the body size + const resizeObserver = new ResizeObserver(sendPageHeight); + resizeObserver.observe(document.body); + + // Cleanup + return () => { + resizeObserver.disconnect(); + clearTimeout(debounceTimeout.current); + }; + }, [router.pathname]); + + return null; +}; + +export default IframeCommunication; diff --git a/package-lock.json b/package-lock.json index 4d256bf..10de902 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@alkemio/documentation", - "version": "0.0.1", + "version": "0.0.3", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@alkemio/documentation", - "version": "0.0.1", + "version": "0.0.3", "license": "EUPL-1.2", "dependencies": { "next": "^14.2.5", diff --git a/package.json b/package.json index e457885..c0a08fc 100644 --- a/package.json +++ b/package.json @@ -1,31 +1 @@ -{ - "name": "@alkemio/documentation", - "version": "0.0.1", - "description": "Alkemio platform documentation", - "author": "Alkemio Foundation", - "repository": { - "type": "git", - "url": "https://github.com/alkem-io/documentation" - }, - "license": "EUPL-1.2", - "scripts": { - "dev": "next -p 3010", - "build": "next build", - "start": "next start -p 3010", - "export": "next export" - }, - "dependencies": { - "next": "^14.2.5", - "nextra": "^2.13.4", - "nextra-theme-docs": "^2.13.4", - "react": "^18.3.1", - "react-dom": "^18.3.1" - }, - "engines": { - "node": ">=20.9.0", - "npm": ">=10" - }, - "volta": { - "node": "20.13.1" - } -} +{"name":"@alkemio/documentation","version":"0.0.3","description":"Alkemio platform documentation","author":"Alkemio Foundation","repository":{"type":"git","url":"https://github.com/alkem-io/documentation"},"license":"EUPL-1.2","scripts":{"dev":"next -p 3010","build":"next build","start":"next start -p 3010","export":"next export"},"dependencies":{"next":"^14.2.5","nextra":"^2.13.4","nextra-theme-docs":"^2.13.4","react":"^18.3.1","react-dom":"^18.3.1"},"engines":{"node":">=20.9.0","npm":">=10"},"volta":{"node":"20.13.1"}} \ No newline at end of file diff --git a/pages/_app.js b/pages/_app.js index d3c3c5a..4dcf7a2 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -1,6 +1,7 @@ import '../styles.css' +import IframeCommunication from '../components/iframeCommunication'; // This default export is required in a new `pages/_app.js` file. export default function MyApp({ Component, pageProps }) { - return + return <>; } diff --git a/pages/getting-started/find-space.en-US.mdx b/pages/getting-started/find-space.en-US.mdx index 1d1e937..c0b61e2 100644 --- a/pages/getting-started/find-space.en-US.mdx +++ b/pages/getting-started/find-space.en-US.mdx @@ -12,4 +12,4 @@ To change your personal details, click on the gear icon to the right of your nam ### Example ![Example Profile](/profile-example.png) As an employee at Alkemio, I will fill out my name, demographics, jobtitle in the tagline and some information about what I do, how I got here and what my interests are in the Bio. I also fill in some skills like Open Source, GitHub, Community Management and Customer Success in the Skills field, so people can quickly see my fields of expertise. I fill out my interests and values, like GreenTech and Sustainability in the Keywords section. -I will also add the link to my LinkedIn profile, my GitHub page and my X profile when I have those. \ No newline at end of file +I will also add the link to my LinkedIn profile, my GitHub page and my X profile when I have those. \ No newline at end of file diff --git a/styles.css b/styles.css index 76da3be..d15cb5c 100644 --- a/styles.css +++ b/styles.css @@ -1,4 +1,5 @@ body { font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; + overflow-y: hidden; } \ No newline at end of file