- );
-};
-
-export default DevControlPanel;
diff --git a/src/components/FloatingMenu.tsx b/src/components/FloatingMenu.tsx
deleted file mode 100644
index b459bb9..0000000
--- a/src/components/FloatingMenu.tsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import { Path, useLocation } from "wouter";
-import { navigate } from "wouter/use-browser-location";
-import { FloatingMenuProps } from "../types/floatingMenuTypes";
-import { capitalizeFirstLetter } from "../utils/StringTransformationUtils";
-
-// -----VARIABLES-----
-// Exported variables for shared location state management
-export let location: Path;
-export let setLocation: typeof navigate;
-
-// -----COMPONENT-----
-/**
- * FloatingMenu Component
- *
- * This component renders a customizable floating menu with interactive elements.
- * It uses the 'wouter' library for location management and provides a dynamic way
- * to render menu items based on the 'menuStructure' prop passed to it.
- *
- * @param {FloatingMenuProps} props - The properties passed to the FloatingMenu component.
- * @returns {JSX.Element} A React component that renders a floating menu.
- */
-const FloatingMenu = (props: FloatingMenuProps) => {
- // Setting up location hooks for navigation
- [location, setLocation] = useLocation();
-
- // Function to generate interactive buttons based on provided menu structure
- const generateButtons = () => {
- return props.menuStructure.map((item, index) => {
- // Checking if the menu item includes label, icon, and action for button generation
- if ("label" in item && "icon" in item && "action" in item) {
- return (
-
-
- {item.icon}
-
-
- );
- } else {
- // Rendering custom JSX elements when provided
- return (
-
- {item.element}
-
- );
- }
- });
- };
-
- // Render the floating menu with dynamically generated buttons
- return (
-
+
+
+ );
+};
+
+export default ThemeButton;
diff --git a/src/templates/HomePageTemplate.tsx b/src/components/templates/HomePageTemplate.tsx
similarity index 68%
rename from src/templates/HomePageTemplate.tsx
rename to src/components/templates/HomePageTemplate.tsx
index e981866..cf7cfeb 100644
--- a/src/templates/HomePageTemplate.tsx
+++ b/src/components/templates/HomePageTemplate.tsx
@@ -1,4 +1,8 @@
import { useTranslation } from "react-i18next";
+import MenuContainer from "../atoms/MenuContainer";
+import LogoutButton from "../organisms/LogoutButton";
+import ThemeButton from "../organisms/ThemeButton";
+import LanguageButton from "../organisms/LanguageButton";
export interface HomePageTemplateProps {
buttonLabel: string;
@@ -10,6 +14,11 @@ const HomePageTemplate = (props: HomePageTemplateProps) => {
const { t } = useTranslation();
return (
+
+
+
+
+
HomePage
diff --git a/src/components/templates/LoginPageTemplate.tsx b/src/components/templates/LoginPageTemplate.tsx
new file mode 100644
index 0000000..0356009
--- /dev/null
+++ b/src/components/templates/LoginPageTemplate.tsx
@@ -0,0 +1,68 @@
+import MenuContainer from "@root/src/components/atoms/MenuContainer";
+import ThemeButton from "@root/src/components/organisms/ThemeButton";
+import { main } from "@root/src/configure";
+import { useTranslation } from "react-i18next";
+import LanguageButton from "../organisms/LanguageButton";
+interface LoginPageTemplateProps {
+ handleLogin: () => void;
+ getStartedOnClick: () => void;
+}
+const LoginPageTemplate = ({
+ handleLogin,
+ getStartedOnClick,
+}: LoginPageTemplateProps) => {
+ const { t } = useTranslation();
+ return (
+
+
+
+
+
+
+
+
{main.program_name}
+
{main.program_description}
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default LoginPageTemplate;
diff --git a/src/configure.tsx b/src/configure.tsx
index bde98d0..d1b9ec8 100644
--- a/src/configure.tsx
+++ b/src/configure.tsx
@@ -1,10 +1,3 @@
-import { FiHome, FiLogIn } from "react-icons/fi";
-import { setLocation } from "./components/FloatingMenu";
-import ThemeButton from "./components/ThemeButton";
-import { HOME, LANGUAGE, LOGIN, THEME } from "./consts";
-import { MenuStructure } from "./types/floatingMenuTypes";
-import { setLanguage } from "./main";
-import { HiMiniLanguage } from "react-icons/hi2";
/* INSTRUCTIONS:
* Here you can configure:
* - program version
@@ -19,74 +12,23 @@ export const main = {
api_url: viteEnv.VITE_API_URL || `setup in .env.${viteEnv.MODE}`,
base_path: viteEnv.VITE_BASE_PATH || "/",
program_authors: [{ name: "Author Name", email: "email@example.com" }],
- program_description: `It is a software application that helps organizations manage maintenance activities. With a ${viteEnv.VITE_APP_NAME}, companies can track preventative maintenance schedules, record equipment repairs, and monitor inventory levels. It also allows for easy reporting and analysis, providing valuable insights into maintenance operations. By automating these processes, a ${viteEnv.VITE_APP_NAME} can help reduce costs, improve efficiency, and ensure compliance with regulatory standards.`,
+ program_description:
+ "Lorem ipsum dolor sit amet consectetur adipisicing elit. In eum ratione deserunt veritatis voluptatibus fugit harum? Commodi, eaque saepe facere maiores sit adipisci quis rerum doloribus quia excepturi in tenetur praesentium soluta asperiores nesciunt? Debitis nisi autem ipsa, laborum cumque minima officiis incidunt ullam quaerat similique officia beatae voluptatum maxime praesentium non laudantium rem asperiores amet at! Rem quis quidem ut aspernatur enim aperiam. Tenetur delectus nulla cupiditate corporis quisquam autem ab tempora. Vel voluptatum sit corrupti veniam tempore quos at vero hic alias necessitatibus quidem rerum deleniti enim adipisci nobis repellat, facere ullam modi error quaerat. A, tempora aliquam!",
program_name:
`${viteEnv.VITE_APP_NAME}${viteEnv.MODE ? " [development]" : ""}` ||
"setup in .env",
program_version: "1.0.0",
};
// -------- FRONTEND CONFIGURATION --------
-// sizes in pixels
-export const topbarSize = 64;
-export const sidebarSize = 256;
-export const floatingLanguageMenuStructure: MenuStructure[] = [
+export const languageMenu = [
{
label: "English",
icon: