mirror of
https://github.com/meshtastic/meshtastic.git
synced 2025-01-15 07:47:50 -08:00
Code cleanup and fix linting/formatting
This commit is contained in:
parent
d299f3bdd5
commit
401364d746
|
@ -1,5 +1,4 @@
|
||||||
import React, { useEffect, useState } from 'react';
|
import BrowserOnly from "@docusaurus/BrowserOnly";
|
||||||
import BrowserOnly from '@docusaurus/BrowserOnly';
|
|
||||||
import {
|
import {
|
||||||
Accordion,
|
Accordion,
|
||||||
AccordionItem,
|
AccordionItem,
|
||||||
|
@ -21,7 +20,7 @@ export interface Faq {
|
||||||
* @type {Function}
|
* @type {Function}
|
||||||
*/
|
*/
|
||||||
const getOpenFaqItemsFromUrl = (slug: string): string[] => {
|
const getOpenFaqItemsFromUrl = (slug: string): string[] => {
|
||||||
if (typeof window !== 'undefined') {
|
if (typeof window !== "undefined") {
|
||||||
// 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);
|
||||||
|
|
||||||
|
@ -29,24 +28,22 @@ 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
|
||||||
console.log(slug, openFaqItemsString ? openFaqItemsString.split(",") : []);
|
|
||||||
return openFaqItemsString ? openFaqItemsString.split(",") : [];
|
return openFaqItemsString ? openFaqItemsString.split(",") : [];
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Updates query parameters in the url when items are opened
|
* Updates query parameters in the url when items are opened
|
||||||
* so that a link can be shared with the faq item already opened
|
* so that a link can be shared with the faq item already opened
|
||||||
*/
|
*/
|
||||||
const handleChange = (
|
const handleChange = (
|
||||||
openFaqItems: (string | number)[],
|
openFaqItems: (string | number)[],
|
||||||
slug: string
|
slug: string,
|
||||||
): void => {
|
): void => {
|
||||||
// Get current url params
|
|
||||||
const searchParams = new URLSearchParams(window.location.search);
|
const searchParams = new URLSearchParams(window.location.search);
|
||||||
|
|
||||||
if (openFaqItems.length > 0) {
|
if (openFaqItems.length > 0) {
|
||||||
// Convert openFaqItems to a comma-separated string and update/add the parameter
|
// Create comma-separated string and update/add the parameter
|
||||||
searchParams.set(
|
searchParams.set(
|
||||||
`openFaqItems-${slug}`,
|
`openFaqItems-${slug}`,
|
||||||
openFaqItems.map(String).join(","),
|
openFaqItems.map(String).join(","),
|
||||||
|
@ -61,20 +58,10 @@ const handleChange = (
|
||||||
window.location.pathname
|
window.location.pathname
|
||||||
}?${searchParams.toString()}`;
|
}?${searchParams.toString()}`;
|
||||||
|
|
||||||
// Use history.pushState to change the URL without reloading the page
|
// Change the URL without reloading the page
|
||||||
window.history.pushState({ path: newUrl }, "", newUrl);
|
window.history.pushState({ path: newUrl }, "", newUrl);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* We need to get the query params using docusaurus' router
|
|
||||||
* because `window` isn't available server side
|
|
||||||
* @return {[type]} [description]
|
|
||||||
*/
|
|
||||||
const useQuery = () => {
|
|
||||||
const { search } = useLocation();
|
|
||||||
return React.useMemo(() => new URLSearchParams(search), [search]);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const FaqAccordion = ({
|
export const FaqAccordion = ({
|
||||||
rows,
|
rows,
|
||||||
slug,
|
slug,
|
||||||
|
@ -101,17 +88,20 @@ export const FaqAccordion = ({
|
||||||
<script
|
<script
|
||||||
type="application/ld+json"
|
type="application/ld+json"
|
||||||
// biome-ignore lint: we need dangerouslySetInnerHTML here, and since we're the ones setting the content it's should be safe
|
// biome-ignore lint: we need dangerouslySetInnerHTML here, and since we're the ones setting the content it's should be safe
|
||||||
dangerouslySetInnerHTML={{ __html: JSON.stringify(faqStructuredData) }}
|
dangerouslySetInnerHTML={{
|
||||||
|
__html: JSON.stringify(faqStructuredData),
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
<Accordion
|
<Accordion
|
||||||
allowMultipleExpanded={true}
|
allowMultipleExpanded={true}
|
||||||
allowZeroExpanded={true}
|
allowZeroExpanded={true}
|
||||||
onChange={(itemUuids) => {
|
onChange={(itemUuids) => {
|
||||||
handleChange(itemUuids, slug)
|
handleChange(itemUuids, slug);
|
||||||
}}
|
}}
|
||||||
preExpanded={getOpenFaqItemsFromUrl(slug)}
|
preExpanded={getOpenFaqItemsFromUrl(slug)}
|
||||||
>
|
>
|
||||||
{rows.map((row, index) => (
|
{rows.map((row, index) => (
|
||||||
|
// biome-ignore lint/suspicious/noArrayIndexKey: React complains if there is no key
|
||||||
<AccordionItem key={index}>
|
<AccordionItem key={index}>
|
||||||
<AccordionItemHeading aria-level="2">
|
<AccordionItemHeading aria-level="2">
|
||||||
<AccordionItemButton>{row.title}</AccordionItemButton>
|
<AccordionItemButton>{row.title}</AccordionItemButton>
|
||||||
|
|
Loading…
Reference in a new issue