formatting and linting

This commit is contained in:
thomas.ekstrand 2024-02-12 21:57:05 -06:00
parent b687e0b5b8
commit 88ce2a7a94

View file

@ -1,13 +1,13 @@
import React from "react"; import React from "react";
import ReactMarkdown from "react-markdown";
import { import {
Accordion, Accordion,
AccordionItem, AccordionItem,
AccordionItemHeading,
AccordionItemButton, AccordionItemButton,
AccordionItemHeading,
AccordionItemPanel, AccordionItemPanel,
} from "react-accessible-accordion"; } from "react-accessible-accordion";
import "react-accessible-accordion/dist/fancy-example.css"; import "react-accessible-accordion/dist/fancy-example.css";
import ReactMarkdown from "react-markdown";
export interface Faq { export interface Faq {
title: string; title: string;
@ -19,7 +19,7 @@ export interface Faq {
* faq items that should be pre-opened * faq items that should be pre-opened
* @type {Function} * @type {Function}
*/ */
const getOpenFaqItemsFromUrl = (slug: String): string[] => { const getOpenFaqItemsFromUrl = (slug: string): string[] => {
// Use URLSearchParams to parse the query parameters from the current URL // Use URLSearchParams to parse the query parameters from the current URL
const searchParams = new URLSearchParams(window.location.search); const searchParams = new URLSearchParams(window.location.search);
@ -27,13 +27,13 @@ const getOpenFaqItemsFromUrl = (slug: String): string[] => {
const openFaqItemsString = searchParams.get(`openFaqItems-${slug}`); const openFaqItemsString = searchParams.get(`openFaqItems-${slug}`);
// If the parameter exists, split it by commas into an array; otherwise, return an empty array // If the parameter exists, split it by commas into an array; otherwise, return an empty array
return openFaqItemsString ? openFaqItemsString.split(',') : []; return openFaqItemsString ? openFaqItemsString.split(",") : [];
}; };
export const FaqAccordion = ({ export const FaqAccordion = ({
rows, rows,
slug slug,
}: { rows: Faq[], slug: String }): JSX.Element => { }: { rows: Faq[]; slug: string }): JSX.Element => {
// Set the faq structured data // Set the faq structured data
const faqStructuredData = { const faqStructuredData = {
"@context": "https://schema.org", "@context": "https://schema.org",
@ -50,7 +50,9 @@ export const FaqAccordion = ({
// Use the getOpenFaqItemsFromUrl function to set the // Use the getOpenFaqItemsFromUrl function to set the
// initial state of preExpanded based on URL parameters // initial state of preExpanded based on URL parameters
const [preExpanded, setPreExpanded] = React.useState<string[]>(getOpenFaqItemsFromUrl(slug)); const [preExpanded, setPreExpanded] = React.useState<string[]>(
getOpenFaqItemsFromUrl(slug),
);
/** /**
* Updates query parameters in the url when items are opened * Updates query parameters in the url when items are opened
@ -62,17 +64,22 @@ export const FaqAccordion = ({
if (openFaqItems.length > 0) { if (openFaqItems.length > 0) {
// Convert openFaqItems to a comma-separated string and update/add the parameter // Convert openFaqItems to a comma-separated string and update/add the parameter
searchParams.set(`openFaqItems-${slug}`, openFaqItems.map(String).join(',')); searchParams.set(
`openFaqItems-${slug}`,
openFaqItems.map(String).join(","),
);
} else { } else {
// If openFaqItems is empty, remove the parameter from the URL // If openFaqItems is empty, remove the parameter from the URL
searchParams.delete(`openFaqItems-${slug}`); searchParams.delete(`openFaqItems-${slug}`);
} }
// Construct the new URL, preserve existing parameters // Construct the new URL, preserve existing parameters
const newUrl = `${window.location.protocol}//${window.location.host}${window.location.pathname}?${searchParams.toString()}`; const newUrl = `${window.location.protocol}//${window.location.host}${
window.location.pathname
}?${searchParams.toString()}`;
// Use history.pushState to change the URL without reloading the page // Use history.pushState to change the URL without reloading the page
window.history.pushState({ path: newUrl }, '', newUrl); window.history.pushState({ path: newUrl }, "", newUrl);
}; };
return ( return (
@ -89,7 +96,7 @@ export const FaqAccordion = ({
preExpanded={preExpanded} preExpanded={preExpanded}
> >
{rows.map((row, index) => ( {rows.map((row, index) => (
<AccordionItem key={index}> <AccordionItem>
<AccordionItemHeading aria-level="2"> <AccordionItemHeading aria-level="2">
<AccordionItemButton>{row.title}</AccordionItemButton> <AccordionItemButton>{row.title}</AccordionItemButton>
</AccordionItemHeading> </AccordionItemHeading>