template-react-app/src/configure.tsx
2024-01-25 20:01:42 +01:00

93 lines
2.9 KiB
TypeScript

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
* - program description
* - program authors
* - floating menu structure (icons, labels, actions)
*/
// -------- ENVIRONMENT VARIABLES --------
export const viteEnv = import.meta.env;
//Main configuration, static data, mostly used here
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_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[] = [
{
label: "English",
icon: <p>🇬🇧</p>,
action: () => {
console.log("English");
setLanguage("eng");
},
},
{
label: "Polski",
icon: <p>🇵🇱</p>,
action: () => {
console.log("Polski");
setLanguage("pol");
},
},
];
export const floatingMenuStructure: MenuStructure[] = [
{
label: HOME,
icon: <FiHome />,
action: () => setLocation("/"),
},
{
label: LOGIN,
icon: <FiLogIn />,
action: () => setLocation(`/${LOGIN}`),
},
{ label: THEME, element: <ThemeButton /> },
{
label: LANGUAGE,
element: (
<div className="dropdown dropdown-left">
<div tabIndex={0} role="button" className="btn btn-circle btn-outline">
<HiMiniLanguage />
</div>
<ul
tabIndex={0}
className="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-52 mr-1"
>
{floatingLanguageMenuStructure.map((element, index) => {
return (
<li key={element.label + index}>
<a
onClick={() => {
if ("action" in element && typeof element.action === "function")
element.action();
else console.log("No action");
}}
>
{element.label} {"icon" in element ? element.icon : null}
</a>
</li>
);
})}
</ul>
</div>
),
},
];