diff --git a/.env.example b/.env.example index 4c1468c..6968694 100644 --- a/.env.example +++ b/.env.example @@ -15,7 +15,7 @@ # Define this variable, if you are running different versions of the RSD, in # order to define the docker project name. If you leave this empty, docker will # automatically name the containers. -COMPOSE_PROJECT_NAME="rpd" +COMPOSE_PROJECT_NAME="kin" # ---- PUBLIC ENV VARIABLES ------------- @@ -25,7 +25,7 @@ POSTGRES_DB_HOST=database # consumed by services: backend POSTGRES_DB_HOST_PORT=5432 # consumed by services: database, backend -POSTGRES_DB=rpd-db +POSTGRES_DB=kin-rpd-db # consumed by services: database POSTGRES_USER=rsd diff --git a/frontend/__tests__/Home.test.tsx b/frontend/__tests__/Home.test.tsx index e8731f6..679e2e5 100644 --- a/frontend/__tests__/Home.test.tsx +++ b/frontend/__tests__/Home.test.tsx @@ -16,49 +16,49 @@ import {WrappedComponentWithProps} from '~/utils/jest/WrappedComponents' // required when AppHeader component is used jest.mock('~/auth/api/useLoginProviders') // use DEFAULT MOCK for organisation list used by Helmholtz homepage -jest.mock('~/components/home/helmholtz/useOrganisations') +// jest.mock('~/components/home/helmholtz/useOrganisations') const props = { - host: { - name: 'rsd' - }, - counts: { - software_cnt: 1111, - project_cnt: 2222, - organisation_cnt: 3333 - } + host: { + name: 'rsd' + }, + counts: { + software_cnt: 1111, + project_cnt: 2222, + organisation_cnt: 3333 } +} describe('pages/index.tsx', () => { - it('renders default RSD Home page when host=rsd', () => { + it('renders default KIN Home page when host=rsd', () => { render(WrappedComponentWithProps(Home, { props })) - const page = screen.getByTestId('rsd-home-page') + const page = screen.getByTestId('kin-home-page') expect(page).toBeInTheDocument() }) - it('renders default RSD Home page when host=""', () => { + it('renders default KIN Home page when host=""', () => { defaultRsdSettings.host.name='' render(WrappedComponentWithProps(Home, { props, settings: defaultRsdSettings })) - const page = screen.getByTestId('rsd-home-page') + const page = screen.getByTestId('kin-home-page') expect(page).toBeInTheDocument() }) - it('renders default RSD Home page when no host prop', () => { + it('renders default KIN Home page when no host prop', () => { render(WrappedComponentWithProps(Home)) - const page = screen.getByTestId('rsd-home-page') + const page = screen.getByTestId('kin-home-page') expect(page).toBeInTheDocument() }) - it('renders counts on RSD Home page', () => { + it('renders counts on KIN Home page', () => { render(WrappedComponentWithProps(Home,{props})) // software_cnt - const software = screen.getByText(`${props.counts.software_cnt} Software`) - expect(software).toBeInTheDocument() + // const software = screen.getByText(`${props.counts.software_cnt} Software`) + // expect(software).toBeInTheDocument() // project_cnt const project = screen.getByText(`${props.counts.project_cnt} Projects`) expect(project).toBeInTheDocument() @@ -67,23 +67,23 @@ describe('pages/index.tsx', () => { expect(organisation).toBeInTheDocument() }) - it('renders Helmholtz Home page when host=helmholtz', () => { - defaultRsdSettings.host.name='helmholtz' - render(WrappedComponentWithProps(Home, { - props, - settings: defaultRsdSettings - })) - const page = screen.getByTestId('rsd-helmholtz-home') - expect(page).toBeInTheDocument() - }) + // it('renders Helmholtz Home page when host=helmholtz', () => { + // defaultRsdSettings.host.name='helmholtz' + // render(WrappedComponentWithProps(Home, { + // props, + // settings: defaultRsdSettings + // })) + // const page = screen.getByTestId('rsd-helmholtz-home') + // expect(page).toBeInTheDocument() + // }) - it('renders Helmholtz Home page when host=HELMHoltz', () => { - defaultRsdSettings.host.name='HELMholtz' - render(WrappedComponentWithProps(Home, { - props, - settings: defaultRsdSettings - })) - const page = screen.getByTestId('rsd-helmholtz-home') - expect(page).toBeInTheDocument() - }) + // it('renders Helmholtz Home page when host=HELMHoltz', () => { + // defaultRsdSettings.host.name='HELMholtz' + // render(WrappedComponentWithProps(Home, { + // props, + // settings: defaultRsdSettings + // })) + // const page = screen.getByTestId('rsd-helmholtz-home') + // expect(page).toBeInTheDocument() + // }) }) diff --git a/frontend/components/AppFooter/OrganisationLogo.tsx b/frontend/components/AppFooter/OrganisationLogo.tsx index 7a18e91..6e86265 100644 --- a/frontend/components/AppFooter/OrganisationLogo.tsx +++ b/frontend/components/AppFooter/OrganisationLogo.tsx @@ -24,7 +24,7 @@ export default function OrganisationLogo({host}: { host: RsdHost }) { ) } if (host?.logo_url) { - const {name,logo_url,website}=host + const {name,logo_url}=host return (
diff --git a/frontend/components/AppFooter/index.tsx b/frontend/components/AppFooter/index.tsx index 824c42e..ea5111f 100644 --- a/frontend/components/AppFooter/index.tsx +++ b/frontend/components/AppFooter/index.tsx @@ -22,12 +22,14 @@ export default function AppFooter () {

- The Research Software Directory promotes the impact, re-use and citation of research software. + KIN connects, broadens, deepens, and unlocks knowledge for transitions towards a climate-neutral and climate-resilient society

- -
- + {/*
*/} +
+ +
+
diff --git a/frontend/components/AppHeader/index.tsx b/frontend/components/AppHeader/index.tsx index 3242b4c..425bae2 100644 --- a/frontend/components/AppHeader/index.tsx +++ b/frontend/components/AppHeader/index.tsx @@ -15,8 +15,8 @@ import useRsdSettings from '~/config/useRsdSettings' import AddMenu from './AddMenu' import LoginButton from '~/components/login/LoginButton' import JavascriptSupportWarning from './JavascriptSupportWarning' -import LogoApp from '~/assets/LogoApp.svg' -import LogoAppSmall from '~/assets/LogoAppSmall.svg' +// import LogoApp from '~/assets/LogoApp.svg' +// import LogoAppSmall from '~/assets/LogoAppSmall.svg' import GlobalSearchAutocomplete from '~/components/GlobalSearchAutocomplete' import FeedbackPanelButton from '~/components/feedback/FeedbackPanelButton' import ResponsiveMenu from './ResponsiveMenu' @@ -50,19 +50,18 @@ export default function AppHeader() { className="flex-1 flex flex-col px-4 xl:flex-row items-start lg:container lg:mx-auto">
- - diff --git a/frontend/components/GlobalSearchAutocomplete/GlobalsSearchAutocomplete.test.tsx b/frontend/components/GlobalSearchAutocomplete/GlobalsSearchAutocomplete.test.tsx index 4caf70c..1488ada 100644 --- a/frontend/components/GlobalSearchAutocomplete/GlobalsSearchAutocomplete.test.tsx +++ b/frontend/components/GlobalSearchAutocomplete/GlobalsSearchAutocomplete.test.tsx @@ -35,7 +35,7 @@ it('shows 3 navigation option on focus', async () => { // should show 3 navigation options const listItems = screen.getAllByTestId('global-search-list-item') - expect(listItems.length).toEqual(3) + expect(listItems.length).toEqual(2) }) it('calls search api on input', async () => { diff --git a/frontend/components/GlobalSearchAutocomplete/index.tsx b/frontend/components/GlobalSearchAutocomplete/index.tsx index 7017277..647f3a6 100644 --- a/frontend/components/GlobalSearchAutocomplete/index.tsx +++ b/frontend/components/GlobalSearchAutocomplete/index.tsx @@ -61,7 +61,6 @@ export default function GlobalSearchAutocomplete(props: Props) { }, [lastValue]) const defaultValues = [ - {name: 'Go to Software page', slug: '', source: 'software'}, {name: 'Go to Projects page', slug: '', source: 'projects'}, {name: 'Go to Organisations page', slug: '', source: 'organisations'}, ] diff --git a/frontend/components/home/helmholtz/__mocks__/useOrganisations.tsx b/frontend/components/home/helmholtz/__mocks__/useOrganisations.tsx deleted file mode 100644 index 6c2f9ca..0000000 --- a/frontend/components/home/helmholtz/__mocks__/useOrganisations.tsx +++ /dev/null @@ -1,15 +0,0 @@ -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import mockOrganisations from '../../../../__tests__/__mocks__/organisationsOverview.json' - -// DEAFULT MOCK -export default function useOrganisations(token: string) { - // console.log('useOrganisations...default MOCK') - return { - loading:false, - organisations:mockOrganisations - } -} diff --git a/frontend/components/home/helmholtz/index.tsx b/frontend/components/home/helmholtz/index.tsx deleted file mode 100644 index 051afc6..0000000 --- a/frontend/components/home/helmholtz/index.tsx +++ /dev/null @@ -1,426 +0,0 @@ -// SPDX-FileCopyrightText: 2022 - 2023 Dusan Mijatovic (dv4all) -// SPDX-FileCopyrightText: 2022 - 2023 dv4all -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import AppHeader from '~/components/AppHeader' -import AppFooter from '~/components/AppFooter' -import Link from 'next/link' - -import LogoHelmholtz from '~/assets/logos/LogoHelmholtz.svg' -import {OrganisationForOverview} from '~/types/Organisation' - -/*! purgecss start ignore */ -// import 'aos/dist/aos.css' - -import IconButton from '@mui/material/IconButton' -import {ChevronLeft, ChevronRight} from '@mui/icons-material' -import {useAuth} from '~/auth' -import {getImageUrl} from '~/utils/editImage' -import useOrganisations from './useOrganisations' -/*! purgecss end ignore */ - -// type HomeProps = { -// software: number, -// projects: number, -// organisations: number -// } - -type SpotlightDescription = { - name: string, - description: string, - image: string, - link: string -} - -const SPOTLIGHTS= [ - // { - // name: 'MassBank', - // description: 'MassBank is an open source mass spectral library for the identification of small chemical molecules of metabolomics, exposomics and environmental relevance.', - // image: 'https://hifis.net/assets/img/spotlights/massbank/Atrazine_Mass_Spectrum.png', - // link: '/software' - // }, - { - name: 'FishInspector', - description: 'The software FishInspector provides automatic feature detections in images of zebrafish embryos (body size, eye size, pigmentation). It is Matlab-based and provided as a Windows executable (no matlab installation needed).', - image: 'https://hifis.net/assets/img/spotlights/fishinspector/FishInspector.jpg', - link: '/software' - }, - { - name: 'Golem', - description: 'Golem is a modelling platform for thermal-hydraulic-mechanical and non-reactive chemical processes in fractured and faulted porous media.', - image: 'https://hifis.net/assets/img/spotlights/golem/golem_preview.png', - link: '/software/golem-a-moose-based-application' - }, - { - name: 'Lynx', - description: 'LYNX (Lithosphere dYnamics Numerical toolboX) is a novel numerical simulator for modelling thermo-poromechanical coupled processes driving the deformation dynamics of the lithosphere.', - image: 'https://hifis.net/assets/img/spotlights/lynx/lynx_logo.png', - link: '/software/lynx-modelling-lithosperic-dynamics' - }, - { - name: 'MeshIt', - description: 'The tool MeshIT generates quality tetrahedral meshes based on structural geological information. It has been developed at the GFZ Potsdam and some extensions were later added by PERFACCT. All procedures are fully automatized and require at least scattered data points as input.', - image: 'https://hifis.net/assets/img/spotlights/meshit/meshit_logo.png', - link: '/software/meshit' - }, - { - name: 'Palladio', - description: 'Palladio is a software architecture simulation approach which analyses software at the model level for performance bottlenecks, scalability issues, reliability threats, and allows for subsequent optimisation.', - image: 'https://hifis.net/assets/img/spotlights/palladio/palladio_preview.png', - link: '/software/palladio' - } -] - -function LatestSpotlight({name, description, image, link}: - {name:string, description:string, image:string, link: string}) { - return( - -
-
- {name} -
-
-
{name}
-

{description}

-
-
- - ) -} - -function PreviousSpotlight({name, image, link, description, i}: - {name: string, image: string, link: string, description: string | '', i: number}) { - - const MAX_CHARS = 150 - function descriptionParagraph (description: string) { - if (description != '') { - if (description.length > MAX_CHARS) { - let description_trunc = description.substring(0, MAX_CHARS) - description = description_trunc.substring(0, description_trunc.lastIndexOf(' ')) + ' …' - } - return ( -

{description}

- ) - } - } - - return ( - -
- {name} -
-

{name}

- {descriptionParagraph(description)} -
-
- - ) -} - -function Spotlights({spotlights}:{spotlights: Array}) { - let i = 0 - return ( -
- -
- {spotlights.slice(1, 5).map(spotlight => { - i++ - let key = 'spotlight_' + i - return( - - ) - })} -
-
- ) -} - -function ResearchField({background, name}:{background: string, name: string}) { - function mouseEnter(event: React.MouseEvent) { - if (!(event.target instanceof HTMLAnchorElement)) return - const background = '/images/' + event.target.dataset.background - event.target.parentElement!.parentElement!.style.backgroundImage = 'url("' + background + '")' - } - - return ( - {name} - ) -} - -function ResearchFields() { - return ( -
- - - - - - -
- ) -} - -function clearBackgroundImage(event: React.MouseEvent) { - if (!(event.target instanceof HTMLDivElement)) return - event.target.style.backgroundImage = '' -} - -function ParticipatingOrganisations({organisations}:{organisations:OrganisationForOverview[]}) { - return ( -
-
- { - organisations.map(item => { - return( - - {item.name} - - ) - }) - } -
- - - - - - -
- ) -} - -function moveRight() { - const container = document.getElementById('participatingOrganisations') - if(container) { - container.scroll({ - left: container.scrollLeft + 500, - top: 0, - behavior: 'smooth' - }) - } -} - -function moveLeft() { - const container = document.getElementById('participatingOrganisations') - if(container) { - container.scroll({ - left: container.scrollLeft - 500, - top: 0, - behavior: 'smooth' - }) - } -} - -export default function HelmholtzHome() { - const {session}=useAuth() - const {loading,organisations} = useOrganisations(session.token) - - const handleClickOpen = () => { - const loginButton = document.querySelector('.rsd-login-button') - if (loginButton) { - const evt = new MouseEvent('click', { - bubbles: true - }) - loginButton.dispatchEvent(evt) - } - } - - return ( -
- - - - {/* Head and claim */} -
-
-
- -
Research for grand challenges.
- {/* -
- Add your software -
-
*/} -
-
-

Promote and Discover
Research Software

-
Because software matters
-
-
-
- - {/* Software spotlights */} -
-

Software Spotlights

-
Outstanding software products of the Helmholtz community
-
- -
- -
- Browse software -
- -
-
-
- - {/* Software meta repository */} -
-
-

Discover by research topic

- {/*
Browse Software by Research Topic
*/} - -
-
- - {/* Teaser */} -
-
-
-

Upcoming

-
This service is in active development. Upcoming features include:
-
-
Login with your Helmholtz Institution's account
-
Add your own software products
-
Add related projects, funding and institutions
-
Obtain a free license consultation from HIFIS
-
-
Do you have suggestions for improvements or new features?
-
Please let us know! Send us an e-mail, or open an issue in our GitHub repository.
-
-
-
-
- - {/* Participating organsiations */} -
-
-

Participating organisations

- -
-
- - {/* For RSEs and Researchers */} - {/*
-
-

For RSEs and Researchers

-
A place for Research Software that is being developed in the Helmholtz Association.
-
-
-
For Research Software Engineers
-
-
-
Promote
-
Increase the impact of your software by reaching a broader audience
-
-
-
Impact
-
Gain acknowledgement by proper citation of your code
-
-
-
-
-
For Researchers
-
-
-
Discover
-
Discover software relevant to your research interest
-
-
-
Cite
-
Version specific bibliography supports correct software citation
-
-
-
- -
-
-
*/} - -
- ) -} - -// export async function getServerSideProps(context: GetServerSidePropsContext) { -// const {req} = context -// const token = req?.cookies['rsd_token'] -// const url = `${process.env.POSTGREST_URL}/rpc/organisations_overview?parent=is.null` -// const {data} = await getOrganisationsList({url, token}) -// return { -// props: { -// organisations: data -// } -// } -// } diff --git a/frontend/components/home/helmholtz/useOrganisations.tsx b/frontend/components/home/helmholtz/useOrganisations.tsx deleted file mode 100644 index fdb5fd8..0000000 --- a/frontend/components/home/helmholtz/useOrganisations.tsx +++ /dev/null @@ -1,64 +0,0 @@ -// SPDX-FileCopyrightText: 2022 Dusan Mijatovic (dv4all) -// SPDX-FileCopyrightText: 2022 dv4all -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import {useEffect, useState} from 'react' -import {createJsonHeaders} from '~/utils/fetchHelpers' -import logger from '~/utils/logger' - -async function getOrganisationsList({url, token}: {url: string, token?: string}) { - try { - const resp = await fetch(url, { - method: 'GET', - headers: { - ...createJsonHeaders(token), - }, - }) - - if ([200, 206].includes(resp.status)) { - const json = await resp.json() - return { - data: json - } - } - // otherwise request failed - logger(`getOrganisationsList failed: ${resp.status} ${resp.statusText}`, 'warn') - // we log and return zero - return { - data: [] - } - } catch (e: any) { - logger(`getOrganisationsList: ${e?.message}`, 'error') - return { - data: [] - } - } -} - - -export default function useOrganisations(token:string) { - const [organisations, setOrganisations] = useState([]) - const [loading, setLoading] = useState(true) - - useEffect(() => { - let abort = false - async function getData() { - setLoading(true) - const url = '/api/v1/rpc/organisations_overview?parent=is.null' - const {data} = await getOrganisationsList({url, token}) - if (abort) return - setOrganisations(data) - setLoading(false) - } - getData() - return () => { abort = true } - }, [token]) - - return { - loading, - organisations - } -} diff --git a/frontend/components/home/imperial/CounterBox.tsx b/frontend/components/home/imperial/CounterBox.tsx deleted file mode 100644 index b6ed0b3..0000000 --- a/frontend/components/home/imperial/CounterBox.tsx +++ /dev/null @@ -1,18 +0,0 @@ -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -type CounterBoxProps = { - label: string - value: string -} - -export default function CounterBox({label,value}:CounterBoxProps) { - return ( -
-
{label}
-
{value}
-
- ) -} diff --git a/frontend/components/home/imperial/KeywordBox.tsx b/frontend/components/home/imperial/KeywordBox.tsx deleted file mode 100644 index 355e927..0000000 --- a/frontend/components/home/imperial/KeywordBox.tsx +++ /dev/null @@ -1,25 +0,0 @@ -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import Link from 'next/link' - -import {ssrProjectsUrl} from '~/utils/postgrestUrl' - -type KeywordBoxProps = { - label: string -} - -export default function KeywordBox({label}: KeywordBoxProps) { - const url = ssrProjectsUrl({keywords: [label]}) - return ( -
-
- - {label} - -
-
- ) -} diff --git a/frontend/components/home/imperial/Keywords.tsx b/frontend/components/home/imperial/Keywords.tsx deleted file mode 100644 index 030acf4..0000000 --- a/frontend/components/home/imperial/Keywords.tsx +++ /dev/null @@ -1,30 +0,0 @@ -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import KeywordBox from './KeywordBox' - -type KeywordsProps = { - keywords: Array -} - -type KeywordsObject = { - keyword: string -} - -export default function Keywords({keywords}: KeywordsProps) { - const keywordButtons = keywords.map((keyword: KeywordsObject, index: number) => { - return - }) - return ( -
-
- Popular Keywords -
-
- {keywordButtons} -
-
- ) -} diff --git a/frontend/components/home/imperial/MainContentImperialCollege.tsx b/frontend/components/home/imperial/MainContentImperialCollege.tsx deleted file mode 100644 index 06cd001..0000000 --- a/frontend/components/home/imperial/MainContentImperialCollege.tsx +++ /dev/null @@ -1,104 +0,0 @@ -// SPDX-FileCopyrightText: 2023 - 2024 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import Image from 'next/legacy/image' -import Link from 'next/link' - -import {HomeProps} from 'pages' -import CounterBox from './CounterBox' -import Keywords from './Keywords' -import {useSession} from '~/auth' -import {useAuth} from '~/auth' -import useImperialData from './useImperialData' -import useLoginProviders from '~/auth/api/useLoginProviders' -import ContentLoader from '~/components/layout/ContentLoader' -import MainContent from '~/components/layout/MainContent' -import {Provider} from 'pages/api/fe/auth' - -function set_location_cookie() { - // set cookie so that user is bounced to the software submission page - // after authentication - document.cookie = 'rsd_pathname=/software/add;path=/auth;SameSite=None;Secure' -} - -function submit_software_href(auth_status: string, login_providers: Provider[]) { - if (auth_status == 'authenticated') { - return '/software/add' - } - return (login_providers[0]?.redirectUrl ?? '') -} - -export default function MainContentImperialCollege({counts,news}: HomeProps) { - const {token} = useSession() - const {loading, keywords} = useImperialData(token) - const {session} = useAuth() - const providers = useLoginProviders() - const auth_status = session?.status || 'loading' - - return ( - -
-
- Imperial College London logo - -
- Software plays an increasingly important role in research. Despite this, - it can be difficult to promote and showcase software through traditional - academic means. The Imperial Research Software Directory provides a - place to tell the world about your research software. Do you develop - software at Imperial? Add your package to the directory! -
-
-
-
- -
Browse Software
- -
-
- -
Submit Software
- -
-
-
- -
- - - -
- - { - loading ? - - : -
- -
- } - -
- ) -} diff --git a/frontend/components/home/imperial/index.tsx b/frontend/components/home/imperial/index.tsx deleted file mode 100644 index 607c06b..0000000 --- a/frontend/components/home/imperial/index.tsx +++ /dev/null @@ -1,34 +0,0 @@ -// SPDX-FileCopyrightText: 2023 - 2024 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import {app} from '~/config/app' -import AppHeader from '~/components/AppHeader' -import AppFooter from '~/components/AppFooter' -import PageMeta from '~/components/seo/PageMeta' -import CanonicalUrl from '~/components/seo/CanonicalUrl' -import {HomeProps} from 'pages/index' - -import MainContentImperialCollege from './MainContentImperialCollege' - -const pageTitle = `Home | ${app.title}` -const pageDesc = 'The Research Software Directory is designed to show the impact research software has on research and society. We stimulate the reuse of research software and encourage proper citation of research software to ensure researchers and RSEs get credit for their work.' - -export default function ImperialCollegeHome({counts,news}: HomeProps) { - return ( - <> - - - -
- - - -
- - ) -} diff --git a/frontend/components/home/imperial/useImperialData.tsx b/frontend/components/home/imperial/useImperialData.tsx deleted file mode 100644 index c1eb941..0000000 --- a/frontend/components/home/imperial/useImperialData.tsx +++ /dev/null @@ -1,81 +0,0 @@ -// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center) -// SPDX-FileCopyrightText: 2023 Netherlands eScience Center -// -// SPDX-License-Identifier: Apache-2.0 - -import {useEffect, useState} from 'react' -import {OrganisationForOverview} from '~/types/Organisation' -import {createJsonHeaders} from '~/utils/fetchHelpers' -import logger from '~/utils/logger' - -/** - * Example of actual request to api with error handling and logging - * @param param0 - * @returns - */ -async function getKeywordList({url, token}: {url: string, token?: string}) { - try { - const resp = await fetch(url, { - method: 'GET', - headers: { - ...createJsonHeaders(token), - }, - }) - - if ([200, 206].includes(resp.status)) { - const json = await resp.json() - return { - data: json - } - } - // otherwise request failed - logger(`getKeywordList failed: ${resp.status} ${resp.statusText}`, 'warn') - // we log and return zero - return { - data: [] - } - } catch (e: any) { - logger(`getKeywordList: ${e?.message}`, 'error') - return { - data: [] - } - } -} - -export type keyword = { - keyword: string -} - -/** - * Custom react hook to fetch any additional data - * needed for the custom Imperial College homepage - */ -export default function useImperialData(token: string) { - const [keywords, setKeywords] = useState([]) - const [loading, setLoading] = useState(true) - - useEffect(() => { - let abort = false - - async function getData() { - setLoading(true) - - const url = '/api/v1/rpc/keyword_count_for_software' - const {data} = await getKeywordList({url, token}) - - if (abort) return - - setKeywords(data) - setLoading(false) - } - - getData() - - return () => { abort = true } - }, [token]) - - return { - keywords, - loading - } -} diff --git a/frontend/components/home/kin/AboutUsSection.tsx b/frontend/components/home/kin/AboutUsSection.tsx new file mode 100644 index 0000000..e4bcc10 --- /dev/null +++ b/frontend/components/home/kin/AboutUsSection.tsx @@ -0,0 +1,50 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +import useRsdSettings from '~/config/useRsdSettings' +import GradientBorderButton from './GradientBorderButton' +import {config} from './config' + +const {button} = config + +export default function AboutUsSection() { + const {host} = useRsdSettings() + + return ( +
+

+ About us +

+

+ KIN connects, broadens, deepens, and unlocks knowledge for transitions towards a climate-neutral and climate-resilient society +

+
+
+ +
+
+ +
+
+
+ ) +} diff --git a/frontend/components/home/kin/ContributeSection.tsx b/frontend/components/home/kin/ContributeSection.tsx new file mode 100644 index 0000000..12ede02 --- /dev/null +++ b/frontend/components/home/kin/ContributeSection.tsx @@ -0,0 +1,74 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +import Image from 'next/legacy/image' +import GradientBorderButton from './GradientBorderButton' +import {config} from './config' + +const {button} = config + +export default function ContributeSection() { + return ( +
+
+
+ rsd-illustration +
+
+
+

+ Do You Want to Contribute? +

+

+ KIN connects, broadens, deepens, and unlocks knowledge for transitions towards a climate-neutral and climate-resilient society. Do you want to contribute to this as well? +

+
+
+ +
+ {/*
+ +
+
+ +
*/} +
+
+
+ ) +} diff --git a/frontend/components/home/kin/GradientBorderButton.tsx b/frontend/components/home/kin/GradientBorderButton.tsx new file mode 100644 index 0000000..f8b6c13 --- /dev/null +++ b/frontend/components/home/kin/GradientBorderButton.tsx @@ -0,0 +1,13 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +export default function GradientBorderButton({text, url, target = '_self', minWidth = '9rem'}: { text: string, url: string, target?: string, minWidth?: string }) { + return + + +} diff --git a/frontend/components/home/kin/HomepageDivider.tsx b/frontend/components/home/kin/HomepageDivider.tsx new file mode 100644 index 0000000..bd6044b --- /dev/null +++ b/frontend/components/home/kin/HomepageDivider.tsx @@ -0,0 +1,10 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +export default function HomepageDivider() { + return ( +
+ ) +} diff --git a/frontend/components/home/kin/JumboBanner.tsx b/frontend/components/home/kin/JumboBanner.tsx new file mode 100644 index 0000000..a891806 --- /dev/null +++ b/frontend/components/home/kin/JumboBanner.tsx @@ -0,0 +1,47 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +export default function JumboBanner() { + return ( +
+ {/* Jumbo Text*/} +
+

+ Accelerating Transitions Together +

+

+ The Netherlands has what it takes to make the major transitions needed for a sustainable future. Civil society players are working hard to change the system. Companies and organisations are taking action, governments are adapting policies and much has been invested in scientific knowledge. However, to prevent the worst climate change, this has to happen faster! This is only possible if knowledge from practice and science cooperate more intensively. +

+ {/*

+ The KIN brings all parties together. Together, we want to make a substantial contribution to accelerating the transitions needed to be a sustainable, climate-neutral society by 2050 as soon as possible. +

*/} +
+ + + {/* Video: it will only load once the page is rendered, and only when the user clicks on play. And it will strea the video after. */} + {/* */} +
+ ) +} diff --git a/frontend/components/home/kin/OurProgramsSection.tsx b/frontend/components/home/kin/OurProgramsSection.tsx new file mode 100644 index 0000000..60ee472 --- /dev/null +++ b/frontend/components/home/kin/OurProgramsSection.tsx @@ -0,0 +1,68 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +import LandingPageCiteIcon from '~/components/icons/LandingPageCiteIcon.svg' +import LandingPageShowIcon from '~/components/icons/LandingPageShowIcon.svg' +import LandingPageShareIcon from '~/components/icons/LandingPageShareIcon.svg' +import LandingPageImpactIcon from '~/components/icons/LandingPageImpactIcon.svg' + +export default function OurProgramsSection() { + return ( +
+

+ Our Programs +

+ +
+
+ +
+

Netherlands Work Programs

+

+ KIN’s work programmes focus on accelerating systemic transitions. Applying a systemic lens, we look at the connection between sub-problems. This provides long-term action perspectives. To this end, we work in co-creation, with different types of actors from different disciplines. Our work programmes bring knowledge and practice together and are therefore mission-driven. +

+
+
+
+ +
+

+ Global Transitions +

+

+ Climate change is a global problem, requiring global solutions. With the Paris Agreement, the countries that emit the most CO2 have committed to support countries that suffer the most. The KIN underlines the importance of this commitment. With the Global Transitions (GT) programme, we focus on accelerating local transitions in those countries that have contributed least to climate change but are most vulnerable to its impacts. +

+
+
+
+ +
+

+ Events +

+

+ KIN, together with the Pact and/or partners, regularly organizes activities that bring together research and practice. +

+
+
+
+ +
+

+ Short-Term Programs +

+

+ In addition to larger work programs, KIN also focuses on short-term programs that can achieve quick results. +

+
+
+
+
+ ) +} diff --git a/frontend/components/home/kin/StatsSection.tsx b/frontend/components/home/kin/StatsSection.tsx new file mode 100644 index 0000000..c9642df --- /dev/null +++ b/frontend/components/home/kin/StatsSection.tsx @@ -0,0 +1,42 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +type StarsSectionProps={ + project_cnt: number, + organisation_cnt: number, + contributor_cnt: number, + software_mention_cnt: number, +} + + +export default function StarsSection({ + project_cnt,organisation_cnt, + contributor_cnt,software_mention_cnt +}:StarsSectionProps) { + return ( +
+ +
+
{project_cnt} Projects
+
registered
+
+ +
+
{organisation_cnt} Organisations
+
contributed
+
+ +
+
{contributor_cnt} Contributors
+
to research software
+
+ +
+
{software_mention_cnt} Mentions
+
of research software
+
+
+ ) +} diff --git a/frontend/components/home/kin/TopNewsSection.tsx b/frontend/components/home/kin/TopNewsSection.tsx new file mode 100644 index 0000000..72a33a3 --- /dev/null +++ b/frontend/components/home/kin/TopNewsSection.tsx @@ -0,0 +1,72 @@ +// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +import Link from 'next/link' +import {TopNewsProps} from '~/components/news/apiNews' +import GradientBorderButton from './GradientBorderButton' +import {config} from './config' + +const {button} = config + +function TopNewsItem({item}:{item:TopNewsProps}){ + return ( + +
+ {/* */} +
+

{item.title}

+

{item.summary}

+
+ +
+ + ) +} +/** + * Top news items including the homepage divider. + * If there are no news items it returns null. + * */ +export default function TopNewsSection({news}:{news:TopNewsProps[]}) { + + // console.group('TopNewsSection') + // console.log('news...',news) + // console.groupEnd() + + if (news?.length > 0){ + return ( + <> +
+ +

+ Latest news +

+ +
+ {news.map(item=>{ + return + })} +
+ +
+
+
+ + ) + } + return null +} diff --git a/frontend/components/home/kin/config.ts b/frontend/components/home/kin/config.ts new file mode 100644 index 0000000..63a18da --- /dev/null +++ b/frontend/components/home/kin/config.ts @@ -0,0 +1,107 @@ +// SPDX-FileCopyrightText: 2022 Dusan Mijatovic (dv4all) +// SPDX-FileCopyrightText: 2022 dv4all +// SPDX-FileCopyrightText: 2023 - 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +export const config = { + button: { + discover: { + label: 'Discover Software', + url: '/software?order=mention_cnt', + target:'_self' + }, + signUp: { + label: 'Sign up to contribute', + // MOVED to form + // url: 'https://research-software-directory.github.io/documentation/getting-access.html', + // target: '_blank' + }, + register: { + label: 'Register your organisation', + // MOVED to form + // url: 'mailto:rsd@esciencecenter.nl?subject=Register organisation', + // target: '_blank' + }, + demo: { + label: 'Demo', + url: '/documentation/users/online-demo/', + target: '_blank' + }, + docs: { + label: 'Docs', + url: '/documentation/', + target: '_blank' + }, + faq: { + label: 'FAQ', + url: 'https://hetkin.nl/en/faq-en/', + target: '_blank' + }, + team: { + label: 'Our story', + url: 'https://hetkin.nl/en/about-us/', + target: '_blank' + }, + github: { + label: 'Join us on GitHub', + url: 'https://github.com/research-software-directory/KIN-RPD', + target: '_blank' + }, + contact: { + label: 'Contact us', + url: 'https://hetkin.nl/en/contact-page/', + target: '_blank' + }, + news:{ + label: 'More news', + url: '/news', + target: '_self' + } + } +} + +export const personalSignUp = { + notification: [ + '* Required', + 'We will use your default email application to send an email to rsd@esciencecenter.nl. Please send us an email directly if this fails.' + ], + name: { + label: 'Your name *' + }, + affiliation: { + label: 'Your affiliation *' + }, + role: { + label: 'Your professional role' + }, + orcid: { + label: 'Your ORCID' + }, + description: { + label: 'Any additional information you would like to share about your request, such as a description of the content you would like to contribute.', + } +} + +export const organisationSignUp = { + notification: [ + '* Required', + 'We will use your default email application to send an email to rsd@esciencecenter.nl. Please send us an email directly if this fails.' + ], + name: { + label: 'Name *' + }, + organisation: { + label: 'Organisation *' + }, + role: { + label: 'Professional role' + }, + // rorId: { + // label: 'ROR id' + // }, + description: { + label: 'Any additional information you would like to share about your request such as a link to the website of your organisation.', + } +} diff --git a/frontend/components/home/kin/index.tsx b/frontend/components/home/kin/index.tsx new file mode 100644 index 0000000..c15bfbb --- /dev/null +++ b/frontend/components/home/kin/index.tsx @@ -0,0 +1,92 @@ +// SPDX-FileCopyrightText: 2022 - 2023 Dusan Mijatovic (dv4all) +// SPDX-FileCopyrightText: 2022 - 2023 dv4all +// SPDX-FileCopyrightText: 2023 - 2024 Dusan Mijatovic (Netherlands eScience Center) +// SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center +// +// SPDX-License-Identifier: Apache-2.0 + +import {useEffect} from 'react' + +import AOS from 'aos' +/*! purgecss start ignore */ +import 'aos/dist/aos.css' + +import AppHeader from '~/components/AppHeader' +import AppFooter from '~/components/AppFooter' +import {TopNewsProps} from '~/components/news/apiNews' +import Arc from '~/components/home/rsd/arc.svg' +import StatsSection from './StatsSection' +import JumboBanner from './JumboBanner' +import TopNewsSection from './TopNewsSection' +import HomepageDivider from './HomepageDivider' +import AboutUsSection from './AboutUsSection' +import OurProgramsSection from './OurProgramsSection' + + +import ContributeSection from './ContributeSection' + +export type RsdHomeProps = { + software_cnt: number, + open_software_cnt: number, + project_cnt: number, + organisation_cnt: number, + contributor_cnt: number, + software_mention_cnt: number, + news: TopNewsProps[] +} + +export default function RsdHome({ + project_cnt, organisation_cnt, + contributor_cnt, software_mention_cnt,news +}: RsdHomeProps) { + // Initialize AOS library + useEffect(() => { + AOS.init({offset: 16}) + }, []) + + return ( +
+ {/* Header */} + + + {/* Jumbo Banner */} + + + {/* KIN stats */} + + +
+ {/* Arc separator */} + + {/* Get started section */} + {/* */} + {/* Top news items, ONLY if there are some */} + + {/* Divider */} + + {/* Our Programs Section */} + + {/* Divider */} + + {/* Contribute section */} + + {/* Divider */} + + {/* About us section */} + + {/* Divider */} + {/* */} + {/* Logos */} + {/* */} + {/* Footer */} +
+ +
+
+ ) +} diff --git a/frontend/config/app.ts b/frontend/config/app.ts index 7483ca2..95209a2 100644 --- a/frontend/config/app.ts +++ b/frontend/config/app.ts @@ -4,6 +4,6 @@ // SPDX-License-Identifier: Apache-2.0 export const app = { - title: 'Research Software Directory', + title: 'Klimaatonderzoek Initiatief Nederland', unsavedChangesMessage: 'Moving away from editing will discard your changes. This action can not be undone.' } diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx index df28728..3ff896e 100644 --- a/frontend/pages/index.tsx +++ b/frontend/pages/index.tsx @@ -8,9 +8,8 @@ import {app} from '~/config/app' import {getHomepageCounts} from '~/components/home/getHomepageCounts' -import HelmholtzHome from '~/components/home/helmholtz' -import ImperialCollegeHome from '~/components/home/imperial' -import RsdHome,{RsdHomeProps} from '~/components/home/rsd' +import KinRpdHome from '~/components/home/kin' +import {RsdHomeProps} from '~/components/home/rsd' import PageMeta from '~/components/seo/PageMeta' import CanonicalUrl from '~/components/seo/CanonicalUrl' import useRsdSettings from '~/config/useRsdSettings' @@ -22,7 +21,7 @@ export type HomeProps = { } const pageTitle = `Home | ${app.title}` -const pageDesc = 'The Research Software Directory is designed to show the impact research software has on research and society. We stimulate the reuse of research software and encourage proper citation of research software to ensure researchers and RSEs get credit for their work.' +const pageDesc = 'The Research Project Directory is designed to show the impact research software has on research and society. We stimulate the reuse of research software and encourage proper citation of research software to ensure researchers and RSEs get credit for their work.' export default function Home({counts,news}: HomeProps) { const {host} = useRsdSettings() @@ -30,31 +29,10 @@ export default function Home({counts,news}: HomeProps) { // console.group('Home') // console.log('counts...', counts) // console.log('news...', news) + // console.log('host...', host) // console.groupEnd() - if (host && host.name) { - switch (host.name.toLocaleLowerCase()) { - case 'helmholtz': - return - case 'imperial': - return - default: - // RSD default homepage - return ( - <> - {/* Page Head meta tags */} - - {/* canonical url meta tag */} - - - - ) - } - } - // RSD default home page + // KIN home page return ( <> {/* Page Head meta tags */} @@ -64,7 +42,7 @@ export default function Home({counts,news}: HomeProps) { /> {/* canonical url meta tag */} - + ) } diff --git a/frontend/public/android-chrome-192x192.png b/frontend/public/android-chrome-192x192.png index 7ee8fb6..a0137ca 100644 Binary files a/frontend/public/android-chrome-192x192.png and b/frontend/public/android-chrome-192x192.png differ diff --git a/frontend/public/android-chrome-512x512.png b/frontend/public/android-chrome-512x512.png index d51ecb1..5c55637 100644 Binary files a/frontend/public/android-chrome-512x512.png and b/frontend/public/android-chrome-512x512.png differ diff --git a/frontend/public/apple-touch-icon.png b/frontend/public/apple-touch-icon.png index 128b061..ca28740 100644 Binary files a/frontend/public/apple-touch-icon.png and b/frontend/public/apple-touch-icon.png differ diff --git a/frontend/public/favicon-16x16.png b/frontend/public/favicon-16x16.png index b1a51c3..ec0fa24 100644 Binary files a/frontend/public/favicon-16x16.png and b/frontend/public/favicon-16x16.png differ diff --git a/frontend/public/favicon-32x32.png b/frontend/public/favicon-32x32.png index 2a1646b..2674bdc 100644 Binary files a/frontend/public/favicon-32x32.png and b/frontend/public/favicon-32x32.png differ diff --git a/frontend/public/favicon.ico b/frontend/public/favicon.ico index 5d2fcc8..c5dc4b5 100644 Binary files a/frontend/public/favicon.ico and b/frontend/public/favicon.ico differ diff --git a/frontend/public/favicon.ico.license b/frontend/public/favicon.ico.license deleted file mode 100644 index 6663866..0000000 --- a/frontend/public/favicon.ico.license +++ /dev/null @@ -1,4 +0,0 @@ -SPDX-FileCopyrightText: 2021 Dusan Mijatovic (dv4all) -SPDX-FileCopyrightText: 2021 dv4all - -SPDX-License-Identifier: CC-BY-4.0 diff --git a/frontend/public/images/uniting-the-world-to-tackle-climate-change.jpg b/frontend/public/images/uniting-the-world-to-tackle-climate-change.jpg new file mode 100644 index 0000000..df5fc3d Binary files /dev/null and b/frontend/public/images/uniting-the-world-to-tackle-climate-change.jpg differ diff --git a/frontend/public/images/uniting-the-world-to-tackle-climate-change.webp b/frontend/public/images/uniting-the-world-to-tackle-climate-change.webp new file mode 100644 index 0000000..e52bbbc Binary files /dev/null and b/frontend/public/images/uniting-the-world-to-tackle-climate-change.webp differ diff --git a/frontend/public/manifest.json b/frontend/public/manifest.json index 66a5750..9e5d90f 100644 --- a/frontend/public/manifest.json +++ b/frontend/public/manifest.json @@ -1,17 +1,17 @@ { - "name": "Research Software Directory", - "short_name": "RSD", + "name": "Klimaatonderzoek Initiatief Nederland", + "short_name": "KIN", "icons": [ - { - "src": "/android-chrome-192x192.png", - "sizes": "192x192", - "type": "image/png" - }, - { - "src": "/android-chrome-512x512.png", - "sizes": "512x512", - "type": "image/png" - } + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } ], "theme_color": "#ffffff", "background_color": "#ffffff", diff --git a/frontend/public/manifest.json.license b/frontend/public/manifest.json.license deleted file mode 100644 index a3b178b..0000000 --- a/frontend/public/manifest.json.license +++ /dev/null @@ -1,4 +0,0 @@ -SPDX-FileCopyrightText: 2022 Dusan Mijatovic (dv4all) -SPDX-FileCopyrightText: 2022 dv4all - -SPDX-License-Identifier: Apache-2.0 diff --git a/frontend/public/video/RSD-video.mp4 b/frontend/public/video/RSD-video.mp4 deleted file mode 100644 index 6d16acf..0000000 Binary files a/frontend/public/video/RSD-video.mp4 and /dev/null differ diff --git a/frontend/public/video/RSD-video.webm b/frontend/public/video/RSD-video.webm deleted file mode 100644 index 80c4512..0000000 Binary files a/frontend/public/video/RSD-video.webm and /dev/null differ diff --git a/frontend/public/video/rsd-video-cover.webp b/frontend/public/video/rsd-video-cover.webp deleted file mode 100644 index ba93100..0000000 Binary files a/frontend/public/video/rsd-video-cover.webp and /dev/null differ diff --git a/frontend/utils/contentSecurityPolicy.test.ts b/frontend/utils/contentSecurityPolicy.test.ts index 18f3402..c241f1f 100644 --- a/frontend/utils/contentSecurityPolicy.test.ts +++ b/frontend/utils/contentSecurityPolicy.test.ts @@ -20,7 +20,8 @@ beforeEach(() => { it('sets content security policy header for development', () => { const nonce = setContentSecurityPolicyHeader(res as any) const policyName = 'Content-Security-Policy-Report-Only' - const policyText = `default-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' https://*; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; script-src 'nonce-${nonce}' 'strict-dynamic' 'unsafe-eval' 'unsafe-inline' https:` + const policyText = `default-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' https://*; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; frame-src https://www.youtube.com/; script-src 'nonce-${nonce}' 'strict-dynamic' 'unsafe-eval' 'unsafe-inline' https:` + expect(mockSetHeader).toBeCalledTimes(1) // const calledWith = mockSetHeader @@ -32,7 +33,7 @@ it('sets content security policy header for production', () => { process.env.MATOMO_URL = 'https://mamtomo.com/test-url' const nonce = setContentSecurityPolicyHeader(res as any) const policyName = 'Content-Security-Policy' - const policyText = `default-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' https://*; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; script-src 'nonce-${nonce}' 'strict-dynamic' https://mamtomo.com/test-url 'unsafe-inline' https:` + const policyText = `default-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' https://*; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; frame-src https://www.youtube.com/; script-src 'nonce-${nonce}' 'strict-dynamic' https://mamtomo.com/test-url 'unsafe-inline' https:` // "default-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' https://*; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; script-src 'self' 'unsafe-inline' https://mamtomo.com/test-url 'nonce-b771ce36-a563-4e69-b969-0a758ac0762e'" diff --git a/frontend/utils/contentSecurityPolicy.ts b/frontend/utils/contentSecurityPolicy.ts index 3eefe0d..b9e6651 100644 --- a/frontend/utils/contentSecurityPolicy.ts +++ b/frontend/utils/contentSecurityPolicy.ts @@ -36,6 +36,7 @@ let sharedPolicy = ` img-src 'self' data: https://*; base-uri 'none'; object-src 'none'; + frame-src https://www.youtube.com/; ` // default script def - use unsafe-inline for backward compatibilty // https://developer.chrome.com/docs/lighthouse/best-practices/csp-xss/?utm_source=lighthouse&utm_medium=devtools#ensure-csp-is-backwards-compatible