Merge pull request #75 from AlexSciFier/change-frontend-versioning

Change frontend versioning

frontend/.env

@@ -0,0 +1 @@
+REACT_APP_VERSION=$npm_package_version

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neonlink-frontend",
-  "version": "1.2.0",
+  "version": "1.4.10",
   "private": true,
   "dependencies": {
     "@dnd-kit/core": "^6.0.8",

frontend/src/components/PrivateWrapper.jsx

@@ -1,8 +1,14 @@
 import React, { useEffect } from "react";
 import { Route, Routes, useLocation, useNavigate } from "react-router";
 import NavBar from "./NavBar";
-import { useUserCurrentStore, userCurrentKeys } from "../stores/userCurrentStore";
-import { appSettingsKeys, useAppSettingsStore } from "../stores/appSettingsStore";
+import {
+  useUserCurrentStore,
+  userCurrentKeys,
+} from "../stores/userCurrentStore";
+import {
+  appSettingsKeys,
+  useAppSettingsStore,
+} from "../stores/appSettingsStore";
 
 const Dashboard = React.lazy(() => import("../pages/dashboard"));
 const NotFound = React.lazy(() => import("../pages/notFound"));
@@ -20,17 +26,21 @@ const routes = [
 ];
 
 export default function PrivateWrapper() {
-  const [ authenticationEnabled, ] = useAppSettingsStore(appSettingsKeys.AuthenticationEnabled);
-  const [ forceRegistration, ] = useAppSettingsStore(appSettingsKeys.ForceRegistration);
-  const [ authenticated, ] = useUserCurrentStore(userCurrentKeys.Authenticated); 
-  const { pathname,search } = useLocation();
+  const [authenticationEnabled] = useAppSettingsStore(
+    appSettingsKeys.AuthenticationEnabled
+  );
+  const [forceRegistration] = useAppSettingsStore(
+    appSettingsKeys.ForceRegistration
+  );
+  const [authenticated] = useUserCurrentStore(userCurrentKeys.Authenticated);
+  const { pathname, search, hash } = useLocation();
   const navigate = useNavigate();
 
   useEffect(() => {
     if (forceRegistration) navigate("/register");
     else if (authenticationEnabled && !authenticated) navigate("/login");
-    else navigate(pathname+search);
-  // eslint-disable-next-line react-hooks/exhaustive-deps
+    else navigate(pathname + hash + search);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [authenticated, authenticationEnabled, forceRegistration]);
 
   return (

frontend/src/helpers/constants.js

@@ -1,5 +1,5 @@
 export const APP_NAME = "NeonLink";
-export const VERSION = "1.4.8";
+export const VERSION = process.env.REACT_APP_VERSION;
 export const DEF_MAX_ITEMS = 20;
 export const DEF_COLUMNS = 3;
 export const CARD_HEADER_STYLE = [

frontend/src/pages/settings/tabHeader.jsx

@@ -2,13 +2,14 @@ import React from "react";
 
 export default function TabHeader({ title, isActive, onClick }) {
   return (
-    <li
+    <a
       className={`px-4 py-2 hover:bg-cyan-600/10 hover:cursor-pointer ${
         isActive ? "border-b-2 border-cyan-500" : ""
       }`}
       onClick={onClick}
+      href={`#${title}`}
     >
       {title}
-    </li>
+    </a>
   );
 }

frontend/src/pages/settings/tabView.jsx

@@ -1,11 +1,13 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import TabHeader from "./tabHeader";
 import AboutTab from "./tabs/aboutTab";
 import GroupTab from "./tabs/groupTab/groupTab";
 import MainTab from "./tabs/mainTab/mainTab";
 import InterfaceTab from "./tabs/interfaceTab/interfaceTab";
+import { useLocation } from "react-router";
 
 export default function TabView() {
+  const location = useLocation();
   const tabs = [
     {
       header: "Main",
@@ -27,6 +29,14 @@ export default function TabView() {
 
   const [curentTab, setCurentTab] = useState(0);
 
+  useEffect(() => {
+    if (location.hash) {
+      let found = tabs.filter((tab) => tab.header === location.hash.slice(1));
+      let foundIdx = tabs.indexOf(found[0]);
+      setCurentTab(foundIdx);
+    }
+  }, []);
+
   return (
     <div className="md:w-2/4 w-full px-3">
       <ul className="flex gap-3 w-full text-lg overflow-x-auto">