Skip to content

Commit a4f2811

Browse files
rebecamurillorebecamurillo
committed
FAQs
1 parent 7ee2366 commit a4f2811

12 files changed

Lines changed: 259 additions & 64 deletions

File tree

‎src/components/FAQ.astro‎

Lines changed: 0 additions & 49 deletions
This file was deleted.

‎src/components/FAQsUserAccount.astro‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
---
2+
import { FAQAccordion } from "../components/react/ui";
3+
4+
const faqUserAccount = [
5+
{
6+
question: "Are you a SUM Living Lab ?",
7+
answer:
8+
"If this is your first time accessing the platform, create a new account and select your Living Lab from the list.",
9+
ctaLabel: "Sign up",
10+
ctaLink: "/lab-admin/signup",
11+
},
12+
{
13+
question: "Are you a SUM project partner ?",
14+
answer:
15+
"For administrator access, please contact the administrator at odp@sum-project.eu to request special access to the platform.",
16+
ctaLabel: "Contact ODP administrator",
17+
ctaLink: "mailto:odp@sum-project.eu",
18+
},
19+
{
20+
question: "Do you want to create a new Living Lab?",
21+
answer:
22+
"Thank you for your interest in contributing to the SUM project! The feature is currently under construction. Please reach out to the platform administrator at odp@sum-project.eu for more information.",
23+
ctaLabel: "Contact ODP administrator",
24+
ctaLink: "mailto:odp@sum-project.eu",
25+
},
26+
{
27+
question: "I forgot my password, what should I do?",
28+
answer:
29+
"The 'Forgot Password' feature is currently under construction. Please reach out to the platform administrator at odp@sum-project.eu for assistance.",
30+
ctaLabel: "Contact ODP administrator",
31+
ctaLink: "mailto:odp@sum-project.eu",
32+
},
33+
];
34+
---
35+
36+
<div class="gap-4 flex flex-col mt-8">
37+
<h4>Need help ?</h4>
38+
<FAQAccordion questions={faqUserAccount} client:load />
39+
40+
<p>
41+
For more questions, visit our <a
42+
href="/faq"
43+
class="underline text-blue-900"
44+
>
45+
FAQ page</a
46+
>.
47+
</p>
48+
</div>

‎src/components/react/ui/FAQAccordion.tsx‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import React from "react";
2+
import { ExpansionPanel, RButton } from ".";
3+
4+
type FAQItem = {
5+
question: string;
6+
answer: React.ReactNode | string;
7+
ctaLabel?: string;
8+
ctaLink?: string;
9+
};
10+
11+
type Props = {
12+
questions: FAQItem[];
13+
};
14+
15+
export function FAQAccordion({ questions = [] }: Props) {
16+
// defaultTabId={null} -> all closed by default
17+
return (
18+
<div>
19+
{questions.map((q, i) => (
20+
<ExpansionPanel
21+
key={i}
22+
header={<h6 className="">{q.question}</h6>}
23+
arrow
24+
open={false}
25+
content={
26+
<div className="prose">
27+
{/* answer can be string or React node */}
28+
{typeof q.answer === "string" ? <p>{q.answer}</p> : q.answer}
29+
{q.ctaLabel && q.ctaLink && (
30+
<p>
31+
<RButton text={q.ctaLabel} href={q.ctaLink} />
32+
</p>
33+
)}
34+
</div>
35+
}
36+
/>
37+
))}
38+
</div>
39+
);
40+
}

‎src/components/react/ui/RButton.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export function RButton({
2727
}: RButtonProps) {
2828
const classNamePrimary =
2929
" rounded-md bg-secondary px-3.5 py-2.5 text-sm font-semibold text-primary shadow-xs hover:bg-primary-light focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary ";
30-
const classNameLink = " underline text-sm/6 text-gray-900 ";
30+
const classNameLink = " underline text-sm/6 text-blue-900 ";
3131
const classNameSecondary =
3232
" rounded-md border border-secondary px-3.5 py-2.5 text-sm font-semibold shadow-xs hover:bg-primary-light focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-secondary ";
3333

‎src/components/react/ui/Tabs.tsx‎

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ type TabAlign = "left" | "center" | "right";
1010

1111
type Props = {
1212
tabs: Tab[];
13-
defaultTabId?: string;
13+
defaultTabId?: string | null; // null = start with no active tab
1414
onChange?: (id: string) => void;
1515
align?: TabAlign; // new prop
1616
};
@@ -31,18 +31,21 @@ export function Tabs({
3131
onChange,
3232
align = "left",
3333
}: Props) {
34-
const defaultIndex = defaultTabId
35-
? Math.max(
36-
0,
37-
tabs.findIndex((t) => t.id === defaultTabId)
38-
)
39-
: 0;
34+
// defaultTabId === null -> no tab active initially (closed)
35+
// defaultTabId === undefined -> keep previous behavior: default to 0
36+
const defaultIndex =
37+
defaultTabId === null
38+
? -1
39+
: defaultTabId
40+
? Math.max(0, tabs.findIndex((t) => t.id === defaultTabId))
41+
: 0;
4042

43+
const maxIndex = Math.max(-1, tabs.length - 1);
4144
const [activeIndex, setActiveIndex] = useState<number>(
42-
Math.min(Math.max(defaultIndex, 0), Math.max(0, tabs.length - 1))
45+
Math.min(Math.max(defaultIndex, -1), maxIndex)
4346
);
4447

45-
const activeTab = tabs[activeIndex] || tabs[0];
48+
const activeTab = activeIndex >= 0 ? tabs[activeIndex] : undefined;
4649

4750
function selectByIndex(i: number) {
4851
if (i < 0 || i >= tabs.length) return;

‎src/components/react/ui/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,4 @@ export * from "./SiteNavBar";
1313
export * from "./ExpansionPanel";
1414
export * from "./DataDisplayCard";
1515
export * from "./Tooltip";
16+
export * from "./FAQAccordion";

‎src/layouts/Layout.astro‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@ const footerMenuItems = [
5858
items: [
5959
{ label: "About", href: getUrl("/") },
6060
{ label: "Measures", href: getUrl("/data/measures") },
61+
{ label: "FAQ", href: getUrl("/faq") },
6162
// { label: "Analysis Tools", href: "#" },
6263
],
6364
},

‎src/pages/faq.astro‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
---
2+
import { FAQAccordion } from "../components/react/ui";
3+
import Layout from "../layouts/Layout.astro";
4+
5+
const faqLivingLabAccount = [
6+
{
7+
question: "Who can register as a Living Lab in the platform?",
8+
answer:
9+
"Any city willing to contribute KPI values and measures scheduled to be implemented related to New Shared Mobility and its integration with public transport.",
10+
ctaLabel: "Register",
11+
ctaLink: "/lab-admin/signup",
12+
},
13+
{
14+
question: "What information is required when I register my Living Lab?",
15+
answer:
16+
"Lab name, country, location and radius (area), and an estimated population.",
17+
},
18+
{
19+
question: "What is the workflow for data input?",
20+
answer:
21+
"1) Collect baseline data to calculate KPIs; 2) Input 'before' KPI results in the platform; 3) Identify scheduled policy measures; 4) After implementation starts, collect 'after' data; 5) Input 'after' KPI results.",
22+
},
23+
{
24+
question: "Can I update or correct data entries after submission?",
25+
answer:
26+
"Yes — lab administrators may update information as necessary. Living labs are responsible for the accuracy of the data.",
27+
ctaLabel: "Contact ODP administrator",
28+
ctaLink: "mailto:odp@sum-project.eu",
29+
},
30+
{
31+
question:
32+
"Are there templates or guidance documents for data collection and measurement?",
33+
answer:
34+
"Yes, templates and guidance are provided to help calculate KPI values. Resources are available in the Living Lab admin space after registration.",
35+
},
36+
37+
{
38+
question: "Are you a SUM Living Lab ?",
39+
answer:
40+
"If this is your first time accessing the platform, create a new account and select your Living Lab from the list.",
41+
ctaLabel: "Sign up",
42+
ctaLink: "/lab-admin/signup",
43+
},
44+
{
45+
question: "Are you a SUM project partner ?",
46+
answer:
47+
"For administrator access, please contact the administrator at odp@sum-project.eu to request special access to the platform.",
48+
ctaLabel: "Contact ODP administrator",
49+
ctaLink: "mailto:odp@sum-project.eu",
50+
},
51+
{
52+
question: "Do you want to create a new Living Lab?",
53+
answer:
54+
"Thank you for your interest in contributing to the SUM project! The feature is currently under construction. Please reach out to the platform administrator at odp@sum-project.eu for more information.",
55+
ctaLabel: "Contact ODP administrator",
56+
ctaLink: "mailto:odp@sum-project.eu",
57+
},
58+
{
59+
question: "I forgot my password, what should I do?",
60+
answer:
61+
"The 'Forgot Password' feature is currently under construction. Please reach out to the platform administrator at odp@sum-project.eu for assistance.",
62+
ctaLabel: "Contact ODP administrator",
63+
ctaLink: "mailto:odp@sum-project.eu",
64+
},
65+
];
66+
67+
const faqGeneral = [
68+
{
69+
question: "What is the ODP and what is its purpose?",
70+
answer:
71+
"The SUM Open Data Platform tracks and monitors policy measures and KPIs related to Seamless Urban Mobility and its integration with public transport to report implementation and impacts.",
72+
},
73+
{
74+
question: "What data are available through the ODP and in what format?",
75+
answer:
76+
"Living labs, list of measures, list of KPIs and final KPI values per living lab.",
77+
ctaLabel: "View data",
78+
ctaLink: "/data",
79+
},
80+
{
81+
question: "How can I access the data?",
82+
answer:
83+
"Browse the website to view dynamic real life data submitted by living labs. Survey datasets will be added soon. For specific requests contact odp@sum-project.eu.",
84+
ctaLabel: "Contact ODP administrator",
85+
ctaLink: "mailto:odp@sum-project.eu",
86+
},
87+
{
88+
question:
89+
"Are the datasets anonymised and aggregated, or are raw data available?",
90+
answer:
91+
"Only aggregated KPI values are publicly available. Full datasets can be shared on request.",
92+
ctaLabel: "Request data",
93+
ctaLink: "mailto:odp@sum-project.eu",
94+
},
95+
{
96+
question:
97+
"Can I compare across different living labs, measures or countries using the platform?",
98+
answer:
99+
"This feature is under construction and expected to be available by 2026 for the impact assessment reporting period.",
100+
},
101+
{
102+
question: "Who can I contact for further questions or support?",
103+
answer: "For support contact odp@sum-project.eu.",
104+
ctaLabel: "Contact ODP administrator",
105+
ctaLink: "mailto:odp@sum-project.eu",
106+
},
107+
];
108+
---
109+
110+
<Layout>
111+
<section class="max-w-3xl mx-auto my-16 px-4">
112+
<h1 class="text-4xl font-bold mb-8">Frequently Asked Questions</h1>
113+
<div class="space-y-6 mt-12">
114+
<h5 class="text-primary border-b-2 border-primary/60">
115+
Living Lab space
116+
</h5>
117+
<FAQAccordion questions={faqLivingLabAccount} client:load />
118+
</div>
119+
<div class="space-y-6 mt-12">
120+
<h5 class="text-primary border-b-2 border-primary/60">
121+
General questions
122+
</h5>
123+
<FAQAccordion questions={faqGeneral} client:load />
124+
</div>
125+
</section>
126+
</Layout>

‎src/pages/index.astro‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -299,6 +299,31 @@ const steps = [
299299

300300
<!-- Section to display research subjects -->
301301

302+
<!-- FAQ intro section -->
303+
<section
304+
class="bg-white py-12 px-4 sm:px-8 lg:px-16 mt-12 border-t border-gray-100"
305+
>
306+
<div class="max-w-4xl mx-auto text-center">
307+
<h2 class="text-2xl font-bold text-gray-900 mb-3">
308+
Have questions? Visit our FAQ
309+
</h2>
310+
<p class="text-gray-600 mb-6">
311+
Find concise answers about data access, contributing Living Lab results,
312+
measures, KPIs, and technical integration.
313+
</p>
314+
315+
<div class="flex flex-col md:flex-row items-center gap-4 justify-center">
316+
<RButton
317+
href={getUrl("/faq")}
318+
variant="primary"
319+
className="bg-primary text-light"
320+
>
321+
Go to the FAQ →
322+
</RButton>
323+
</div>
324+
</div>
325+
</section>
326+
302327
<CTASection
303328
title="Coming soon ! \nTools and features to explore SUM data"
304329
description="We continue building the SUM Open Data Platform together. Share your feedback or ideas in the link bellow. Some of the upcoming features are :"

‎src/pages/lab-admin/login.astro‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
import Layout from "../../layouts/Layout.astro";
33
import LoginForm from "../../components/react/form/LoginForm";
4-
import FAQ from "../../components/FAQ.astro";
4+
import FAQsUserAccount from "../../components/FAQsUserAccount.astro";
55
---
66

77
<Layout role="visitor">
@@ -13,7 +13,7 @@ import FAQ from "../../components/FAQ.astro";
1313
</p>
1414
<LoginForm client:load />
1515

16-
<FAQ />
16+
<FAQsUserAccount />
1717
</section>
1818
</div>
1919
</Layout>

0 commit comments

Comments
 (0)