From f6ea024b4733a8fc68ca68350ad3e5ec397b34f0 Mon Sep 17 00:00:00 2001 From: Natashia Benzian Olsson Date: Thu, 12 Dec 2024 17:16:06 +0100 Subject: [PATCH 1/2] =?UTF-8?q?=E2=80=9Cresearchpage=E2=80=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- next-app/src/app/researchprojects/page.tsx | 158 ++++++++++ .../Sorted_Swedish_Research_Projects.json | 274 ++++++++++++++++++ 2 files changed, 432 insertions(+) create mode 100644 next-app/src/app/researchprojects/page.tsx create mode 100644 next-app/src/assets/Sorted_Swedish_Research_Projects.json diff --git a/next-app/src/app/researchprojects/page.tsx b/next-app/src/app/researchprojects/page.tsx new file mode 100644 index 0000000..d7ec55e --- /dev/null +++ b/next-app/src/app/researchprojects/page.tsx @@ -0,0 +1,158 @@ +"use client"; + +import { useState, useEffect } from "react"; +import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card"; +import Title from "@/components/common/title"; +import { LastUpdated } from "@/components/common/last-updated"; +import Link from "next/link"; + +// Define the type for a single project +type Project = { + name: string; + link: string; + description: string; + tags: { + disease?: string[]; + participants: string[]; + contextual: string[]; + }; +}; + +// Define breadcrumb type +type Breadcrumb = { + text: string; + link?: string; +}; + +// Breadcrumb data +const breadcrumbs: Breadcrumb[] = [ + { text: "Home", link: "/" }, + { text: "Research Projects" }, // Current page has no link +]; + +// Tag colours +const TAG_COLOURS: { [key: string]: string } = { + participants: "bg-[#82AEB2] text-black", + contextual: "bg-[#E9F2D1] text-black", +}; + +export default function ProjectsPage() { + const [projectData, setProjectData] = useState([]); + const [isLoading, setIsLoading] = useState(true); + + async function fetchProjectData() { + try { + const data = await import("@/assets/Sorted_Swedish_Research_Projects.json"); + setProjectData(data.Projects as Project[]); // Explicitly cast data to the correct type + setIsLoading(false); + } catch (error) { + console.error("Error fetching project data:", error); + setIsLoading(false); + } + } + + useEffect(() => { + fetchProjectData(); + }, []); + + if (isLoading) { + return
Loading...
; + } + + return ( +
+ {/* Breadcrumbs */} + + + {/* Title */} + + Swedish Research Projects + + + {/* Introductory Section */} +
+

+ This page highlights 15 selected research projects tied to biobanks, showcasing their significant role in advancing scientific research and medical innovation. These projects, conducted by academic institutions, healthcare providers, and industry collaborators in Sweden, address key scientific questions, drive technological development, and improve healthcare outcomes. By integrating biological material with comprehensive health data, Swedish biobanks provide a unique platform for longitudinal studies, translational research, and precision medicine. These projects demonstrate how biobank resources bridge the gap between fundamental science and clinical applications. +

+

+ The information on this page is based on the brochure{" "} + + "15 Swedish Research Projects" + {" "} + published by Biobank Sweden. See the brochure for a more comprehensive overview of the projects. +

+
+ + {/* Disclaimer */} +
+

+ To access data, researchers may need to obtain ethical approval, submit + data requests, and set up data management agreements. +

+
+ + {/* Projects */} +
+ {projectData.map((project, index) => ( + + + + + {project.name} + + + + +

+ {project.description || "Description not provided."} +

+
+ {Object.entries(project.tags).map(([category, tags]) => + category !== "disease" && + tags?.map((tag, i) => ( + + {tag} + + )) + )} +
+ + + ))} +
+ + {/* Last Updated */} + +
+ ); +} diff --git a/next-app/src/assets/Sorted_Swedish_Research_Projects.json b/next-app/src/assets/Sorted_Swedish_Research_Projects.json new file mode 100644 index 0000000..6a69dbf --- /dev/null +++ b/next-app/src/assets/Sorted_Swedish_Research_Projects.json @@ -0,0 +1,274 @@ +{ + "Projects": [ + { + "name": "BIG3", + "link": "https://kliniskastudier.se/forum-soder/regionala-forskningsprojekt/big3#:~:text=BIG3%20är%20en%20öppen%20prospektiv,och%20är%20samfinansierat%20med%20AstraZeneca.", + "description": "BIG3 is a collaborative initiative focusing on biobanking and molecular research in glioma, a type of brain tumour. The project aims to integrate clinical data with molecular analyses to enhance the understanding of glioma biology and develop more effective treatments. By establishing a comprehensive biobank of glioma samples, BIG3 facilitates research into tumour genetics, microenvironment, and response to therapies. This resource is instrumental in identifying biomarkers for early diagnosis and potential therapeutic targets, thereby contributing to personalised medicine approaches in neuro-oncology. The collaborative nature of BIG3, involving multiple research institutions and healthcare providers, ensures a multidisciplinary approach to tackling the complexities of glioma, ultimately aiming to improve patient outcomes and survival rates.", + "tags": { + "disease": [ + "Cancer", + "Neurology" + ], + "participants": [ + "1.000-10.000 participants" + ], + "contextual": [ + "Translational Research", + "Drug Discovery" + ] + } + }, + { + "name": "Betydelsen av Migration & Etnicitet för Diabetsutvecklingen I Malmö (MEDIM)", + "link": "https://www.diabetesportalen.lu.se/artikel/manga-manga-fler-typ-2-diabetiker-vantat", + "description": "The MEDIM study investigates how migration and ethnicity influence diabetes development. By examining diverse populations in Malmö, it seeks to identify specific risk factors and inform culturally sensitive prevention strategies, addressing health disparities in diabetes care. MEDIM's findings are crucial for developing inclusive public health policies that cater to diverse communities.", + "tags": { + "disease": [ + "Diabetes", + "Public Health" + ], + "participants": [ + "1.000-10.000 participants" + ], + "contextual": [ + "Preventive Health", + "Population-Based Study" + ] + } + }, + { + "name": "EIMS, IMSE och andra multipel skleros fall-kontroll och läkemedelsstudier", + "link": "https://ki.se/cns/forskning/avdelningen-for-neuro/om-avdelningen-for-neuro/imse", + "description": "The Epidemiological Investigation of Multiple Sclerosis (EIMS) and the Immunomodulation and Multiple Sclerosis Epidemiology (IMSE) studies are pivotal in understanding multiple sclerosis (MS) in Sweden. EIMS is a nationwide case-control study that examines genetic and environmental risk factors for MS by enrolling newly diagnosed patients from 42 neurological clinics across the country. IMSE is an ongoing phase IV clinical trial that monitors the long-term safety and efficacy of immunomodulatory treatments for MS. These studies provide comprehensive data on the interplay between genetic predispositions, environmental exposures, and therapeutic interventions in MS. Their extensive datasets support advancements in MS treatment and management strategies, benefiting researchers in neurology and immunology.", + "tags": { + "disease": [ + "Neurology", + "Autoimmune Disease" + ], + "participants": [ + "1.000-10.000 participants" + ], + "contextual": [ + "Case-Control Studies", + "Epidemiological Research" + ] + } + }, + { + "name": "Human Glioblastoma Cell Cultures (HGCC)", + "link": "https://www.hgcc.se/", + "description": "The Human Glioblastoma Cell Cultures (HGCC) initiative provides a comprehensive biobank of glioblastoma cell lines. These 48 well-characterised cell lines are derived from Swedish patients and represent all molecular subtypes of glioblastoma: Classical, Mesenchymal, Neural, and Proneural. HGCC preserves the stem cell-like properties of glioblastoma stem cells, supporting in vitro and in vivo studies. This resource plays a pivotal role in advancing glioblastoma research, including tumour biology, genetic studies, and therapy development. By facilitating targeted therapy discovery, HGCC contributes to improving treatment outcomes for patients with this aggressive brain tumour.", + "tags": { + "disease": [ + "Cancer", + "Neurology" + ], + "participants": [ + "< 1.000 participants" + ], + "contextual": [ + "Preclinical Resource", + "Drug Discovery" + ] + } + }, + { + "name": "KARMA bröstcancerstudien", + "link": "https://karmastudy.org/", + "description": "The KARMA (Karolinska Mammography Project for Risk Prediction of Breast Cancer) study is a prospective cohort involving over 70,000 women attending mammography screening across four hospitals in Sweden. The study collects comprehensive data, including mammographic images, blood samples, and detailed questionnaires covering reproductive health, lifestyle factors, and medical history. The primary objective of KARMA is to develop individualised risk prediction models for breast cancer, incorporating factors such as mammographic density, genetic markers, and lifestyle variables. By identifying women at high risk, the study aims to tailor screening and prevention strategies, thereby reducing breast cancer incidence and mortality. The extensive dataset also supports research into the natural history of breast cancer, the impact of hormonal and reproductive factors, and the development of new diagnostic tools.", + "tags": { + "disease": [ + "Cancer", + "Public Health" + ], + "participants": [ + "> 100.000 participants" + ], + "contextual": [ + "Longitudinal Study", + "Precision Medicine Focus" + ] + } + }, + { + "name": "LifeGene", + "link": "https://www.lifegene.se/", + "description": "Initiated in September 2009, LifeGene is a national prospective population-based cohort study involving over 50,000 participants aged 0–95 years. The KI Biobank stores blood, serum, and urine samples from approximately 30,000 of these participants. Supported by seven Swedish universities with medical faculties, LifeGene aims to explore the complex interactions between genetic predispositions and environmental exposures in health and disease. By facilitating large-scale studies on common diseases, LifeGene contributes to the development of personalised medicine and targeted public health strategies.", + "tags": { + "disease": [ + "Public Health", + "Genetics" + ], + "participants": [ + "10.000-100.000 participants" + ], + "contextual": [ + "Prospective Study", + "Population-Based Study" + ] + } + }, + { + "name": "Malmö förebyggande Medicin (MFM)", + "link": "https://www.malmo-kohorter.lu.se/malmo-forebyggande-medicin-mfm", + "description": "Conducted between 1974 and 1991, involved extensive health screenings of Malmö residents to identify risk factors for cardiovascular diseases and diabetes. The collected data includes biological samples and detailed health information, serving as a foundation for preventive medicine research. MPM has been instrumental in developing risk prediction models and informing public health policies aimed at reducing the burden of chronic diseases.", + "tags": { + "disease": [ + "Cardiovascular Disease", + "Diabetes" + ], + "participants": [ + "10.000-100.000 participants" + ], + "contextual": [ + "Preventive Health", + "Retrospective Study" + ] + } + }, + { + "name": "Malmö Kost Cancer (MKC)", + "link": "https://www.malmo-kohorter.lu.se/malmo-kost-cancer-mkc", + "description": "Initiated in 1991, MDCS investigates the relationships between diet, lifestyle factors, and the incidence of cancer and other chronic diseases. By analysing dietary habits alongside health outcomes, the study provides critical insights into how nutrition influences disease development. The findings from MDCS have informed dietary guidelines and public health recommendations, emphasising the role of nutrition in disease prevention.", + "tags": { + "disease": [ + "Cancer", + "Lifestyle and Diet" + ], + "participants": [ + "10.000\u2013100.000 participants" + ], + "contextual": [ + "Longitudinal Study" + ] + } + }, + { + "name": "Northern Sweden Health and Disease Study (NSHDS)", + "link": "https://www.umu.se/en/biobank-research-unit/provsamlingar-och-register/northern-sweden-health-and-disease-study-vip-monica-and-the-mammography-screening-project/", + "description": "Established in 1985, NSHDS integrates three major cohorts: the Västerbotten Intervention Programme (VIP), the Northern Sweden MONICA study, and the Mammography Screening Project. Collectively, these cohorts encompass over 135,000 participants, providing a rich repository of biological samples and extensive health data. This comprehensive dataset enables researchers to investigate the interplay between genetic, environmental, and lifestyle factors in the development of chronic diseases such as cardiovascular conditions and cancer. The longitudinal nature of NSHDS allows for the study of disease progression and the identification of potential preventive strategies, making it an invaluable resource for epidemiological research and public health interventions.", + "tags": { + "disease": [ + "Cardiovascular Disease", + "Cancer" + ], + "participants": [ + "> 100.000 participants" + ], + "contextual": [ + "Longitudinal Study", + "Population-Based Study" + ] + } + }, + { + "name": "Svenska Tvillingregistret (STR)", + "link": "https://ki.se/forskning/forskningsinfrastruktur-och-miljoer/core-faciliteter-for-forskning/svenska-tvillingregistret", + "description": "One of the world's largest twin registries, encompassing data from both identical and fraternal twins. This unique resource allows researchers to disentangle the relative contributions of genetic and environmental factors to various health outcomes. Studies utilising STR have provided insights into the heritability of diseases, behavioural traits, and the impact of environmental exposures, thereby informing prevention and intervention strategies.", + "tags": { + "disease": [ + "Genetics", + "Neurology" + ], + "participants": [ + "> 100,000 participants" + ], + "contextual": [ + "Longitudinal Study", + "Population-Based Study" + + ] + } + }, + { + "name": "Swedish Infrastructure for Medical Population-Based Life-Course and Environmental Research (SIMPLER)", + "link": "https://www.simpler4health.se/", + "description": "SIMPLER consolidates data from several Swedish cohorts to facilitate research on life-course and environmental factors affecting health. By providing a unified platform for data access, it streamlines research processes and promotes comprehensive studies on public health issues. SIMPLER supports multidisciplinary research, enabling the development of holistic approaches to health promotion and disease prevention.", + "tags": { + "disease": [ + "Public Health", + "Lifestyle and Diet" + ], + "participants": [ + "> 100.000 participants" + ], + "contextual": [ + "Resource Development", + "Population-Based Study" + ] + } + }, + { + "name": "The Environmental Determinants of Diabetes in the Young (TEDDY)", + "link": "https://teddy.epi.usf.edu", + "description": "TEDDY is an international study aiming to identify environmental triggers of type 1 diabetes in genetically susceptible children. By monitoring participants from birth, it endeavours to uncover factors that initiate the autoimmune process, paving the way for preventive interventions. TEDDY's research holds the promise of reducing the incidence of type 1 diabetes through early-life modifications.", + "tags": { + "disease": [ + "Diabetes", + "Paediatrics" + ], + "participants": [ + "10.000-100.000 participants" + ], + "contextual": [ + "International Collaboration", + "Prospective Study", + "Preventive Health" + ] + } + }, + { + "name": "The Malmö Offspring Study (MOS)", + "link": "https://www.malmo-kohorter.lu.se/malmo-offspring-study-mos", + "description": "MOS examines the health and disease patterns across generations by studying the offspring of participants from previous Malmö cohorts. This intergenerational approach allows researchers to explore genetic and environmental contributions to health, enhancing our understanding of familial disease transmission. MOS contributes to the development of strategies aimed at breaking the cycle of hereditary diseases through early interventions.", + "tags": { + "disease": [ + "Public Health", + "Genetics" + ], + "participants": [ + "1.000-10.000 participants" + ], + "contextual": [ + "Intergenerational Study", + "Prospective Study" + ] + } + }, + { + "name": "The Swedish CArdioPulmonary BioImage Study (SCAPIS)", + "link": "https://www.scapis.org/", + "description": "focused on improving the prevention and treatment of cardiovascular and pulmonary diseases. Conducted between 2013 and 2018, the study examined over 30,000 participants aged 50 to 64 across six Swedish university hospitals. SCAPIS utilises advanced imaging techniques, such as coronary computed tomography angiography (CCTA) and carotid ultrasound, combined with biomarker and genetic analyses to detect early signs of disease. The extensive dataset collected includes information on genetic predispositions, lifestyle factors, and environmental exposures. This resource supports the development of predictive models and precision medicine approaches, enabling tailored preventive strategies to reduce morbidity and mortality. SCAPIS also serves as an open-access platform for researchers, fostering collaboration and innovation in cardiopulmonary health research.", + "tags": { + "disease": [ + "Cardiovascular Disease", + "Pulmonary Disease" + ], + "participants": [ + "> 100.000 participants" + ], + "contextual": [ + "Precision Medicine Focus", + "Preventive Health" + ] + } + }, + { + "name": "Uppsala-Umeå Comprehensive Cancer Consortium (U-CAN)", + "link": "https://www.u-can.uu.se/", + "description": "U-CAN collects biological samples and clinical data from cancer patients to support research into cancer diagnostics and treatment. Its systematic biobanking enables the development of personalised cancer therapies, aiming to improve patient outcomes through tailored treatment strategies. U-CAN serves as a critical resource for translational cancer research, bridging the gap between laboratory discoveries and clinical applications.", + "tags": { + "disease": [ + "Cancer", + "Genetics" + ], + "participants": [ + "> 100.000 participants" + ], + "contextual": [ + "Translational Research" + ] + } + } + ] +} \ No newline at end of file From c1df2cfde8e9a0040f4b9b55acfd0bbcf22172c7 Mon Sep 17 00:00:00 2001 From: JanProgrammierung Date: Fri, 13 Dec 2024 13:42:18 +0100 Subject: [PATCH 2/2] Fixed breadcrumbs and small linting error, some other things could be improved in the future like the hardcoded code and some structure (which is good in general but some things we have in specific folders like types and interfaces Signed-off-by: JanProgrammierung --- .../page.tsx | 101 +++++++++++------- 1 file changed, 60 insertions(+), 41 deletions(-) rename next-app/src/app/{researchprojects => swedishresearchprojects}/page.tsx (57%) diff --git a/next-app/src/app/researchprojects/page.tsx b/next-app/src/app/swedishresearchprojects/page.tsx similarity index 57% rename from next-app/src/app/researchprojects/page.tsx rename to next-app/src/app/swedishresearchprojects/page.tsx index d7ec55e..888995c 100644 --- a/next-app/src/app/researchprojects/page.tsx +++ b/next-app/src/app/swedishresearchprojects/page.tsx @@ -5,6 +5,7 @@ import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card"; import Title from "@/components/common/title"; import { LastUpdated } from "@/components/common/last-updated"; import Link from "next/link"; +import { ILink } from "@/interfaces/types"; // Define the type for a single project type Project = { @@ -18,18 +19,11 @@ type Project = { }; }; -// Define breadcrumb type -type Breadcrumb = { - text: string; - link?: string; +const breadcrumbs: { [id: string]: ILink } = { + l1: { text: "Home", classes: "", link: "/" }, + l2: { text: "Research Projects", classes: "", link: "" }, }; -// Breadcrumb data -const breadcrumbs: Breadcrumb[] = [ - { text: "Home", link: "/" }, - { text: "Research Projects" }, // Current page has no link -]; - // Tag colours const TAG_COLOURS: { [key: string]: string } = { participants: "bg-[#82AEB2] text-black", @@ -42,7 +36,9 @@ export default function ProjectsPage() { async function fetchProjectData() { try { - const data = await import("@/assets/Sorted_Swedish_Research_Projects.json"); + const data = await import( + "@/assets/Sorted_Swedish_Research_Projects.json" + ); setProjectData(data.Projects as Project[]); // Explicitly cast data to the correct type setIsLoading(false); } catch (error) { @@ -61,23 +57,21 @@ export default function ProjectsPage() { return (
- {/* Breadcrumbs */} - +
{/* Title */} @@ -87,7 +81,17 @@ export default function ProjectsPage() { {/* Introductory Section */} <div className="prose prose-lg text-gray-700 text-justify mx-auto mb-12"> <p className="mb-4"> - This page highlights 15 selected research projects tied to biobanks, showcasing their significant role in advancing scientific research and medical innovation. These projects, conducted by academic institutions, healthcare providers, and industry collaborators in Sweden, address key scientific questions, drive technological development, and improve healthcare outcomes. By integrating biological material with comprehensive health data, Swedish biobanks provide a unique platform for longitudinal studies, translational research, and precision medicine. These projects demonstrate how biobank resources bridge the gap between fundamental science and clinical applications. + This page highlights 15 selected research projects tied to biobanks, + showcasing their significant role in advancing scientific research and + medical innovation. These projects, conducted by academic + institutions, healthcare providers, and industry collaborators in + Sweden, address key scientific questions, drive technological + development, and improve healthcare outcomes. By integrating + biological material with comprehensive health data, Swedish biobanks + provide a unique platform for longitudinal studies, translational + research, and precision medicine. These projects demonstrate how + biobank resources bridge the gap between fundamental science and + clinical applications. </p> <p> The information on this page is based on the brochure{" "} @@ -97,22 +101,36 @@ export default function ProjectsPage() { rel="noopener noreferrer" className="text-primary hover:underline" > - "15 Swedish Research Projects" + "15 Swedish Research Projects" </a>{" "} - published by Biobank Sweden. See the brochure for a more comprehensive overview of the projects. + published by Biobank Sweden. See the brochure for a more comprehensive + overview of the projects. </p> </div> {/* Disclaimer */} - <div className="w-full max-w-prose bg-muted border border-neutral rounded-lg p-4 text-sm text-muted-foreground text-center mx-auto mb-12"> - <p> - To access data, researchers may need to obtain ethical approval, submit - data requests, and set up data management agreements. - </p> + <div className="alert"> + <svg + xmlns="http://www.w3.org/2000/svg" + fill="none" + viewBox="0 0 24 24" + className="h-6 w-6 shrink-0 stroke-current" + > + <path + strokeLinecap="round" + strokeLinejoin="round" + strokeWidth="2" + d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" + ></path> + </svg> + <span className="text-sm lg:text-base"> + To access data, researchers may need to obtain ethical approval, + submit data requests, and set up data management agreements. + </span> </div> {/* Projects */} - <div className="space-y-6"> + <div className="space-y-6 pt-12"> {projectData.map((project, index) => ( <Card key={index} @@ -134,16 +152,17 @@ export default function ProjectsPage() { {project.description || "Description not provided."} </p> <div className="flex flex-wrap gap-2"> - {Object.entries(project.tags).map(([category, tags]) => - category !== "disease" && - tags?.map((tag, i) => ( - <span - key={`${category}-${i}`} - className={`px-3 py-1 rounded-full text-sm ${TAG_COLOURS[category]}`} - > - {tag} - </span> - )) + {Object.entries(project.tags).map( + ([category, tags]) => + category !== "disease" && + tags?.map((tag, i) => ( + <span + key={`${category}-${i}`} + className={`px-3 py-1 rounded-full text-sm ${TAG_COLOURS[category]}`} + > + {tag} + </span> + )) )} </div> </CardContent>