Merge branch 'main' into 86.add-pre-commit

environment.json

@@ -11,5 +11,7 @@
         "displayText": "Why Neureka?"
     },
     "specUrl": "https://raw.githubusercontent.com/Gleethos/neureka/master/docs/spock/reports",
-    "summaryUrl": "https://raw.githubusercontent.com/Gleethos/neureka/master/docs/spock/reports/summary.json"
+    "summaryUrl": "https://raw.githubusercontent.com/Gleethos/neureka/master/docs/spock/reports/summary.json",
+    "rootUrl": "/spock-react/",
+    "LinkToIssueReport": "https://github.com/Sonatai/spock-react/issues"
 }

index.html

@@ -7,7 +7,7 @@
             name="viewport"
             content="width=device-width, initial-scale=1.0, maximum-scale=5.0"
         />
-        <title>Neureka</title>
+        <title></title>
 
         <!-- Start Single Page Apps for GitHub Pages -->
         <script type="text/javascript">

src/App.tsx

@@ -1,6 +1,8 @@
 import { nanoid } from 'nanoid';
+import { useEffect } from 'react';
 import { Route, Routes } from 'react-router-dom';
 
+import * as config from '../environment.json';
 import { MainNav } from './components/MainNav/MainNav';
 import { LoadingSpinner } from './components/shared/LoadingSpinner/LoadingSpinner';
 import { MarkdownPage } from './components/shared/MarkdownPage';
@@ -19,15 +21,16 @@ import { MarkdownExample } from './pages/MarkdownExample/MarkdownExample';
 export const App = (): JSX.Element => {
     const { data: summary, isLoading, isError } = useGetSummary();
 
+    useEffect(() => {
+        document.title = config.appName;
+    }, []);
+
     if (isError) {
         return (
             <Message level="error" headline="The summary couldn't be loaded">
                 The summary has some loading problems. Please try again later.
                 If the problem still occurs, please open an{' '}
-                <a href="https://github.com/Sonatai/spock-react/issues">
-                    issue
-                </a>
-                .
+                <a href={config.LinkToIssueReport}>issue</a>.
             </Message>
         );
     } else if (isLoading) {

src/Hooks/useActiveLink.ts

@@ -1,11 +1,12 @@
 import { create } from 'zustand';
+import * as config from '../../environment.json';
 
 const getInitialState = () => {
     const pageAndAnchor = window.location.pathname.split('#');
     const page =
-        pageAndAnchor[0] === '/spock-react/'
+        pageAndAnchor[0] === config.rootUrl
             ? '/'
-            : pageAndAnchor[0].replace('/spock-react', '');
+            : pageAndAnchor[0].replace(config.rootUrl, '');
 
     return page;
 };

src/components/MainNav/MainNav.tsx

@@ -6,6 +6,7 @@ import { Link } from 'react-router-dom';
 import { faBook, faHouseChimney } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
+import * as config from '../../../environment.json';
 import GithubLogo from '../../assets/img/github-mark-white.png';
 import { useActiveLink } from '../../Hooks/useActiveLink';
 import { ISummary } from '../../Hooks/useGetSummary';
@@ -18,6 +19,7 @@ interface IMainNav {
 
 export const MainNav = (props: IMainNav) => {
     const { summary } = props;
+
     const { setActiveLink } = useActiveLink();
 
     return (
@@ -29,7 +31,7 @@ export const MainNav = (props: IMainNav) => {
                     setActiveLink('home');
                 }}
             >
-                Neureka
+                {config.appName}
             </Link>
 
             <div className="main__search">
@@ -40,7 +42,7 @@ export const MainNav = (props: IMainNav) => {
                 <h4>Menu</h4>
                 <ul className="main__list">
                     <NavLink href="/">
-                        Home{' '}
+                        Home
                         <FontAwesomeIcon
                             icon={faHouseChimney}
                             size="lg"
@@ -49,7 +51,7 @@ export const MainNav = (props: IMainNav) => {
                     </NavLink>
 
                     <NavLink href="https://github.com/Gleethos/neureka">
-                        Github{' '}
+                        Github
                         <img
                             src={GithubLogo}
                             alt="Github Logo"

src/components/Search/SearchHits/SearchCard/SearchCard.tsx

@@ -38,8 +38,8 @@ export const SearchCard = (props: ISearchCard): JSX.Element => {
 
             <FontAwesomeIcon
                 icon={faAngleRight}
-                //  eslint-disable-next-line tailwindcss/no-custom-classname
-                className="fa-lg card__icon"
+                className="card__icon"
+                size="lg"
             />
         </Link>
     );

src/components/Search/SearchInput/SearchInput.tsx

@@ -52,8 +52,8 @@ export const SearchInput = (props: ISearchInput): JSX.Element => {
         <div className="input__wrapper">
             <FontAwesomeIcon
                 icon={faMagnifyingGlass}
-                //  eslint-disable-next-line tailwindcss/no-custom-classname
-                className="fa-xl input__icon"
+                className="input__icon"
+                size="xl"
             />
             <Input
                 onChange={(e) => {

src/components/shared/MarkdownPage.tsx

@@ -1,3 +1,4 @@
+import * as config from '../../../environment.json';
 import { useMarkdown } from '../../Hooks/useMarkdown';
 import { Layout } from './Layout/Layout';
 import { LoadingSpinner } from './LoadingSpinner/LoadingSpinner';
@@ -18,10 +19,7 @@ export const MarkdownPage = (props: IMarkdownPage): JSX.Element => {
             <Message level="error" headline="Page couldn't be loaded">
                 Sorry the page could not be loaded. Please try again later. If
                 the error still occurs, please open an{' '}
-                <a href="https://github.com/Sonatai/spock-react/issues">
-                    issue
-                </a>
-                .
+                <a href={config.LinkToIssueReport}>issue</a>.
             </Message>
         );
     } else if (isLoading) {

src/main.tsx

@@ -9,12 +9,13 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 import { App } from './App';
 import { Message } from './components/shared/Message/Message';
+import * as config from '../environment.json';
 
 const queryClient = new QueryClient();
 
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
     <React.StrictMode>
-        <BrowserRouter basename="/spock-react">
+        <BrowserRouter basename={config.rootUrl}>
             <QueryClientProvider client={queryClient}>
                 <ErrorBoundary
                     fallback={

src/markdown.d.ts

@@ -1,4 +1,4 @@
 declare module '*.md' {
-    const value: string; // markdown is just a string
+    const value: string;
     export default value;
 }

src/mocks/handlers.ts

@@ -3,7 +3,6 @@ import { rest } from 'msw';
 export const handlers = [
     rest.get('*summary.json', async (req, res, ctx) => {
         return await res(
-            // Respond with a 200 status code
             ctx.status(200),
             ctx.json({
                 name: '',

src/pages/Document.tsx

@@ -1,6 +1,7 @@
 import { nanoid } from 'nanoid';
 import { Fragment } from 'react';
 
+import * as config from '../../environment.json';
 import { Feature } from '../components/Feature/Feature';
 import { Divide } from '../components/shared/Divide/Divide';
 import { Layout } from '../components/shared/Layout/Layout';
@@ -24,10 +25,7 @@ export const Document = (props: IExampleOne): JSX.Element => {
             <Message level="error" headline={`${fileName} couldn't be loaded`}>
                 The page has some loading problems. Please try again later. If
                 the problem still occurs, please open an{' '}
-                <a href="https://github.com/Sonatai/spock-react/issues">
-                    issue
-                </a>
-                .
+                <a href={config.LinkToIssueReport}>issue</a>.
             </Message>
         );
     } else if (isLoading) {

vite.config.ts

@@ -1,9 +1,10 @@
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
+import * as config from './environment.json';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-    base: '/spock-react/',
+    base: config.rootUrl,
     plugins: [react()],
     // @ts-ignore
     test: {