diff --git a/.eslintrc.yml b/.eslintrc.yml index 95487e1d..0ab3a831 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -18,6 +18,9 @@ ignorePatterns: - 'src/routes.tsx' root: true parser: "@typescript-eslint/parser" +settings: + react: + version: detect rules: "react-refresh/only-export-components": - "warn" diff --git a/index.html b/index.html index 07066a4f..06f45edc 100644 --- a/index.html +++ b/index.html @@ -18,11 +18,12 @@ - +
+ diff --git a/language/en.yml b/language/en.yml index 1a741112..7f1f2736 100644 --- a/language/en.yml +++ b/language/en.yml @@ -52,6 +52,10 @@ socials: linkedin: title: "@idrinth/api-bench on LinkedIn" alt: "LinkedIn" + title0: "@idrinth-api-bench user and maintainer group" + text0: "User-Group" + title1: "idrinth-api-bench organisation" + text1: "IAB Org" open-sauced: title: "@idrinth/api-bench projects on OpenSauced" alt: "OpenSauced" @@ -584,8 +588,9 @@ cookie-consent: title: "YouTube" description: "We will load videos from www.youtube-nocookie.com to directly play on the site." -language-switch: - aria: "Language switch" +general: + language-switch: "Language switch" + more: "More here" languages: en: "English" diff --git a/language/it.yml b/language/it.yml index 1d27f727..57183923 100644 --- a/language/it.yml +++ b/language/it.yml @@ -326,19 +326,32 @@ middlewares: description: "I middleware utilizzano un percorso file assoluto per essere caricati. I seguenti caratteri verranno utilizzati per espandere short form:" provided: title: "Middleware forniti" - encoding: "JSON e form encode" - access: "gestione degli access token" - csrf: "gestione del csrf-header" - 2xx: "controllo dello status 2xx" - 403: "controllo dello status 403" - 404: "controllo dello status 404" - user-agent: "user-agent" - cookies: "cookies" - json: "json-validator" - xml: "xml-validator" - silent-server-validator: "silent-server-validator" - success-check: "controllo della risposta success" - failure-check: "controllo della risposta failure" + encoding: + title: "JSON e form encode" + access: + title: "gestione degli access token" + csrf: + title: "gestione del csrf-header" + 2xx: + title: "controllo dello status 2xx" + 403: + title: "controllo dello status 403" + 404: + title: "controllo dello status 404" + user-agent: + title: "user-agent" + cookies: + title: "cookies" + json: + title: "json-validator" + xml: + title: "xml-validator" + silent-server-validator: + title: "silent-server-validator" + success-check: + title: "controllo della risposta success" + failure-check: + title: "controllo della risposta failure" custom: title: "Middleware Personalizzato" description: "Per il middleware personalizzato, implementare la seguente interfaccia. La Prepare viene chiamata prima di inviare una richiesta, la Process dopo una richiesta. Se viene generato un errore durante la process, eventuali ulteriori convalide vengono ignorate." diff --git a/package-lock.json b/package-lock.json index dce3c89f..f9dca5d1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -26,7 +26,7 @@ "@babel/plugin-syntax-import-attributes": "^7.24.6", "@commitlint/cli": "^19.2.1", "@cypress/code-coverage": "^3.12.39", - "@idrinth-api-bench/inline-critical-css": "^1.1.4", + "@idrinth-api-bench/inline-critical-css": "^1.1.5", "@idrinth-api-bench/react-file-based-routes": "^1.3.0", "@idrinth-api-bench/rollup-plugin-react-modular-css": "^1.2.2", "@idrinth/duplicate-style-check": "^1.1.0", @@ -48,7 +48,7 @@ "cypress-split": "^1.23.4", "dotenv": "^16.4.5", "eslint": "^8.57.0", - "eslint-plugin-json": "^4.0.0", + "eslint-plugin-json": "^3.1.0", "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.7", @@ -3660,9 +3660,9 @@ "resolved": "git+ssh://git@github.com/idrinth-api-bench/assets.git#eada675b182fff362f11956921d79453770ece3a" }, "node_modules/@idrinth-api-bench/inline-critical-css": { - "version": "1.1.4", - "resolved": "https://registry.npmjs.org/@idrinth-api-bench/inline-critical-css/-/inline-critical-css-1.1.4.tgz", - "integrity": "sha512-SqVC2Lc/jFvL5G6FlgSjyQ+Nz3WSl1c9FMuN5vmRlI/ljD57Wj2EakVE2Sled+kSuKZmfjfkNv5qNp6soYcAyg==", + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/@idrinth-api-bench/inline-critical-css/-/inline-critical-css-1.1.5.tgz", + "integrity": "sha512-YjD3OEzz2CYib6k0fb5ssc7YlpyetzFPjFRRw+3n/wNVQtQ1JZ4AxVB7N51To6YxFEsAKzfQIMYZEpgLiQCbPA==", "dev": true, "dependencies": { "css": "^3.0.0", @@ -9778,16 +9778,16 @@ } }, "node_modules/eslint-plugin-json": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-json/-/eslint-plugin-json-4.0.0.tgz", - "integrity": "sha512-l/P3WTzl2HI8PbwsbDIrZ+6jvwQI4TGuz20ReJkG3Y+gZS5ZurTgx+gBmuLpOgiqMyDJWyJ7+GCjevWtNYQcUg==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-json/-/eslint-plugin-json-3.1.0.tgz", + "integrity": "sha512-MrlG2ynFEHe7wDGwbUuFPsaT2b1uhuEFhJ+W1f1u+1C2EkXmTYJp4B1aAdQQ8M+CC3t//N/oRKiIVw14L2HR1g==", "dev": true, "dependencies": { "lodash": "^4.17.21", "vscode-json-languageservice": "^4.1.6" }, "engines": { - "node": ">=18.0" + "node": ">=12.0" } }, "node_modules/eslint-plugin-react": { diff --git a/package.json b/package.json index fd73b8b7..11c05c32 100644 --- a/package.json +++ b/package.json @@ -63,7 +63,7 @@ "@commitlint/cli": "^19.2.1", "@idrinth/duplicate-style-check": "^1.1.0", "@idrinth-api-bench/react-file-based-routes": "^1.3.0", - "@idrinth-api-bench/inline-critical-css": "^1.1.4", + "@idrinth-api-bench/inline-critical-css": "^1.1.5", "@idrinth-api-bench/rollup-plugin-react-modular-css": "^1.2.2", "@idrinth/typescript-language-from-yaml": "^1.3.0", "@types/chai": "^4.3.16", @@ -85,7 +85,7 @@ "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.7", - "eslint-plugin-json": "^4.0.0", + "eslint-plugin-json": "^3.1.0", "fta-cli": "^2.0.0", "http-server": "^14.1.1", "knip": "^5.16.0", diff --git a/src/components/Further.tsx b/src/components/Further.tsx new file mode 100644 index 00000000..2c69cbe8 --- /dev/null +++ b/src/components/Further.tsx @@ -0,0 +1,13 @@ +import React from 'react'; +import Lang from './lang.tsx'; +import { + NavLink, +} from 'react-router-dom'; + +const Further = ({ + children, +}: {children: string,},) => + +; + +export default Further; diff --git a/src/components/code-unit.tsx b/src/components/code-unit.tsx index c9176d72..9bf7eb4b 100644 --- a/src/components/code-unit.tsx +++ b/src/components/code-unit.tsx @@ -3,6 +3,7 @@ import languageKey from '../locales/language-key.ts'; import Content from './content.tsx'; import Code from './code.tsx'; import Lang from './lang.tsx'; +import Further from './Further.tsx'; interface CardProps { text: languageKey; @@ -11,6 +12,7 @@ interface CardProps { language: 'bash' | 'typescript' | 'markdown'; prefix?: languageKey; postfix?: languageKey; + more?: string; } const CodeUnit = ({ @@ -19,11 +21,13 @@ const CodeUnit = ({ children, language, prefix, + more, postfix, }: CardProps,) => {prefix &&

} {children} {postfix &&

} + {more && {more}} ; export default CodeUnit; diff --git a/src/components/content-unit.tsx b/src/components/content-unit.tsx index 6e013522..723d4e1c 100644 --- a/src/components/content-unit.tsx +++ b/src/components/content-unit.tsx @@ -4,17 +4,20 @@ import React, { import Lang from './lang.tsx'; import languageKey from '../locales/language-key.ts'; import Content from './content.tsx'; +import Further from './Further.tsx'; interface CardProps { text: languageKey; level: 'h1'|'h2'|'h3'|'h4'|'h5'|'h6'; children: string|languageKey; + more?: string; } const ContentUnit = ({ text, level, children, + more, }: CardProps,) => { const GenerateContent = (): ReactNode => { const keys: languageKey[] = children.split(' ',) as languageKey[]; @@ -24,6 +27,7 @@ const ContentUnit = ({ }; return + { more && {more}} ; }; diff --git a/src/components/dark-mode-button.tsx b/src/components/dark-mode-button.tsx index 52f2cafe..2417e831 100644 --- a/src/components/dark-mode-button.tsx +++ b/src/components/dark-mode-button.tsx @@ -49,7 +49,9 @@ const DarkModeButton = ({ aria-label={isDarkMode ? 'Light Mode' : 'Dark Mode'} onClick={toggleLightDarkMode} > - {isDarkMode ? : } + {isDarkMode + ? + : } ; }; export default DarkModeButton; diff --git a/src/components/faq-item.scss b/src/components/faq-item.scss index 078bf1fe..84e3e59e 100644 --- a/src/components/faq-item.scss +++ b/src/components/faq-item.scss @@ -5,6 +5,7 @@ & > button { width: 100%; + &:focus { box-shadow: 0 0 2em var(--shadow); } diff --git a/src/components/header.tsx b/src/components/header.tsx index 3ebf83a7..6ea96348 100644 --- a/src/components/header.tsx +++ b/src/components/header.tsx @@ -1,7 +1,4 @@ import React from 'react'; -import { - MdArrowDropDown, -} from 'react-icons/md'; import { NavLink, } from 'react-router-dom'; @@ -11,182 +8,21 @@ import pkg from '../../package.json' with { import IAB from '@idrinth-api-bench/assets/iab.svg'; import DarkModeButton from './dark-mode-button.tsx'; import './header.scss'; -import Lang from './lang.tsx'; -import SocialLink from './social-link.tsx'; -import ExternalLink from './external-link.tsx'; - -const preventOpenLink = (event: React.MouseEvent,) => { - event.preventDefault(); - event.stopPropagation(); - const target = (event.target ?? event.currentTarget) as SVGElement; - target.parentElement?.setAttribute( - 'aria-expanded', - target.parentElement?.getAttribute('aria-expanded',) === 'true' - ? 'false' - : 'true', - ); - return false; -}; +import MainNavigation from './main-navigation.tsx'; +import SocialNavigation from './social-navigation.tsx'; const Header = ({ window, }: {window: Window},) =>
@idrinth/api-bench v{pkg.version}
- - + +
; export default Header; diff --git a/src/components/language-switch.tsx b/src/components/language-switch.tsx index 22f77846..1f95dbf5 100644 --- a/src/components/language-switch.tsx +++ b/src/components/language-switch.tsx @@ -20,7 +20,6 @@ const LanguageSwitch = ({ const changeLanguage = (newLanguage: string,) => { setLanguage(newLanguage,); window.localStorage.setItem('language', newLanguage,); - // reload page window.location.reload(); }; diff --git a/src/components/main-navigation-link.tsx b/src/components/main-navigation-link.tsx new file mode 100644 index 00000000..6741e5d8 --- /dev/null +++ b/src/components/main-navigation-link.tsx @@ -0,0 +1,20 @@ +import { + NavLink, +} from 'react-router-dom'; +import Lang from './lang.tsx'; +import React from 'react'; +import languageKey from '../locales/language-key.ts'; + +const MainNavigationLink = ({ + lnkey, + children, +}: { + lnkey: languageKey, + children: string +},) =>
  • + + + +
    • ; + +export default MainNavigationLink; diff --git a/src/components/main-navigation-links.tsx b/src/components/main-navigation-links.tsx new file mode 100644 index 00000000..576a8898 --- /dev/null +++ b/src/components/main-navigation-links.tsx @@ -0,0 +1,41 @@ +import languageKey from '../locales/language-key.ts'; +import { + NavLink, +} from 'react-router-dom'; +import Lang from './lang.tsx'; +import React from 'react'; +import MainNavigationLink from './main-navigation-link.tsx'; +import { + MdArrowDropDown, +} from 'react-icons/md'; +import preventOpenLink from './prevent-open-link.tsx'; + +const mainNavigationLinks = ({ + lnkey, + items, + children, + ariakey, +}: { + lnkey: languageKey, + items: string[], + children: string, + ariakey: string, +},) =>
  • + +
      { + items.map((child,) => {`${ children }/${ child }`},) + }
    +
    • ; + +export default mainNavigationLinks; diff --git a/src/components/main-navigation.tsx b/src/components/main-navigation.tsx new file mode 100644 index 00000000..5cf8cad6 --- /dev/null +++ b/src/components/main-navigation.tsx @@ -0,0 +1,35 @@ +import ExternalLink from './external-link.tsx'; +import React from 'react'; +import MainNavigationLink from './main-navigation-link.tsx'; +import MainNavigationLinks from './main-navigation-links.tsx'; + +const MainNavigation = () => ; + +export default MainNavigation; diff --git a/src/components/middleware.tsx b/src/components/middleware.tsx index d57dd36f..5ecac408 100644 --- a/src/components/middleware.tsx +++ b/src/components/middleware.tsx @@ -3,36 +3,36 @@ import Lang from './lang.tsx'; import languageKey from '../locales/language-key.ts'; const Middleware = ({ - children + children, }: { children: string, -},) => { - return
    -

    - -

    -

    - - - - 

    ^{children}
    -

    -

    - -

    -

    - -

    -

    - -

    -

    - -

    -

    - -

    -
    ; -} +},) =>
    +

    + +

    +

    + + + + 

    ^{children}
    +

    +

    + +

    +

    + +

    +

    + +

    +

    + +

    +

    + +

    +
    ; export default Middleware; diff --git a/src/components/page-layout.tsx b/src/components/page-layout.tsx index b8176c86..a88b160c 100644 --- a/src/components/page-layout.tsx +++ b/src/components/page-layout.tsx @@ -9,15 +9,10 @@ interface LayoutProps { const Layout = ({ children, -}: LayoutProps,) => { - return ( - <> -
    - {children} -