theis.gaedigk/stockhome
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

refactor: edit tailwindcss classes and change code formatting, therefore added .prettierrc file

Browse Source 
fix: frontend bug where the passwords won't be checked when the password is changed
This commit is contained in:
theis.gaedigk
2026-07-08 14:56:43 +02:00
parent 9c50c3f300
commit 6be34c93aa
36 changed files with 1280 additions and 1145 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/LoginCard.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import { useForm } from "@tanstack/react-form";
import { Input, Button, Alert } from "@mui/joy";
import { Alert, Button, Input } from "@mui/joy";
import { useMutation } from "@tanstack/react-query";
import { signInUser } from "../utils/api/auth";
import { useTranslation } from "react-i18next";
frontend/src/components/Sidebar.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import TranslateIcon from "@mui/icons-material/Translate";
import MenuIcon from "@mui/icons-material/Menu";
import CloseIcon from "@mui/icons-material/Close";
import { useNavigate, useMatchRoute } from "@tanstack/react-router";
import { useMatchRoute, useNavigate } from "@tanstack/react-router";
import Cookies from "js-cookie";
import { changeTranslation } from "../utils/uxFncs";
frontend/src/components/StorageRow.tsx
+2 -2
View File
@@ -1,8 +1,8 @@
import { useQueryClient, useMutation } from "@tanstack/react-query";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { deleteStorage, updateStorage } from "../utils/api/storages";
import { useForm } from "@tanstack/react-form";
import { useStore } from "@tanstack/react-store";
import { Input, Button } from "@mui/joy";
import { Button, Input } from "@mui/joy";
import type { Storage } from "../misc/interfaces";
import { formatDate } from "../utils/uxFncs";
import { useTranslation } from "react-i18next";
frontend/src/components/modals/AddStorageModal.tsx
+6 -6
View File
@@ -1,17 +1,17 @@
import {
Alert,
Button,
DialogContent,
DialogTitle,
Input,
Modal,
ModalDialog,
DialogTitle,
DialogContent,
Stack,
Input,
Button,
Alert,
} from "@mui/joy";
import { useForm } from "@tanstack/react-form";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { useTranslation } from "react-i18next";
import type { NewStorage, AlertInterface } from "../../misc/interfaces";
import type { AlertInterface, NewStorage } from "../../misc/interfaces";
import { mutateNewStorage } from "../../utils/api/storages";
import { useState } from "react";
frontend/src/components/modals/ChangePasswordModal.tsx
+34 -6
View File
@@ -1,22 +1,24 @@
import {
Alert,
Button,
DialogTitle,
Input,
Modal,
ModalDialog,
DialogTitle,
Stack,
Input,
Button,
Alert,
} from "@mui/joy";
import { useForm } from "@tanstack/react-form";
import { useMutation } from "@tanstack/react-query";
import { useTranslation } from "react-i18next";
import type { ChangePasswordIntf, AlertInterface } from "../../misc/interfaces";
import type { AlertInterface, ChangePasswordIntf } from "../../misc/interfaces";
import { mutatePassword } from "../../utils/api/auth";
import { useState } from "react";
import { USER_ERROR_CODE } from "@stockhome/shared";
interface ChangePasswordProps {
isOpen: boolean;
setOpen: (value: boolean) => void;
alert: (alert: AlertInterface) => void;
}
export const ChangePasswordModal = (props: ChangePasswordProps) => {
@@ -35,7 +37,18 @@ export const ChangePasswordModal = (props: ChangePasswordProps) => {
newPasswordRep: "",
},
onSubmit: async ({ value }) => {
mutate(value);
console.log(value);
if (value.newPassword === value.newPasswordRep) {
mutate(value);
} else {
setAlert({
isAlert: true,
type: "danger",
header: t("error"),
text: t(USER_ERROR_CODE.PASSWORDS_NOT_MATCHED[0]),
});
}
},
});
@@ -50,6 +63,21 @@ export const ChangePasswordModal = (props: ChangePasswordProps) => {
});
},
onSuccess: () => {
// Sets the success alert in the settings page via component props
props.alert({
isAlert: true,
type: "success",
header: t("success"),
text: t("SU005"),
});
// Sets the success alert locally (in the modal itself)
setAlert({
isAlert: true,
type: "success",
header: t("success"),
text: t("SU005"),
});
props.setOpen(false);
},
});
frontend/src/pages/AddProduct.tsx
+3 -2
View File
@@ -16,8 +16,8 @@ import { useForm } from "@tanstack/react-form";
import { createProduct } from "../utils/api/products";
import { getStorages } from "../utils/api/storages";
import type {
ProductFormValues,
AlertInterface,
ProductFormValues,
Storage,
} from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
@@ -272,10 +272,11 @@ export const AddProduct = () => {
</div>
</div>
</div>
<div className="flex flex-wrap items-center justify-between gap-3">
<div className="flex gap-3 items-center">
<Typography level="body-sm" className="text-slate-500">
{t("product-details")}
</Typography>
<div className="grow"></div>
<Button
type="submit"
loading={isPending}
frontend/src/pages/Inventory.tsx
+6 -7
View File
@@ -1,14 +1,14 @@
import { useEffect, useState } from "react";
import {
Typography,
Alert,
Avatar,
Button,
Checkbox,
Chip,
CircularProgress,
Sheet,
Table,
Avatar,
Chip,
Checkbox,
Alert,
Typography,
} from "@mui/joy";
import { useNavigate } from "@tanstack/react-router";
import { useTranslation } from "react-i18next";
@@ -17,8 +17,7 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { deleteSelectedProducts, getProducts } from "../utils/api/products";
import { formatDate } from "../utils/uxFncs";
import Cookies from "js-cookie";
import type { ProductRow } from "../misc/interfaces";
import type { AlertInterface } from "../misc/interfaces";
import type { AlertInterface, ProductRow } from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
export const InventoryPage = () => {
frontend/src/pages/ProductQuickView.tsx
+10 -10
View File
@@ -1,26 +1,26 @@
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { getStorages } from "../utils/api/storages.ts";
import {
CircularProgress,
Typography,
Select,
Option,
Input,
Alert,
Box,
Button,
Chip,
CircularProgress,
Divider,
Box,
Alert,
Input,
Option,
Select,
Typography,
} from "@mui/joy";
import { useTranslation } from "react-i18next";
import { useEffect, useState } from "react";
import { useForm } from "@tanstack/react-form";
import { mutateProduct, getProductDetails } from "../utils/api/products.ts";
import { getProductDetails, mutateProduct } from "../utils/api/products.ts";
import { toInputDate } from "../utils/uxFncs";
import type {
ProductFormValues,
productDetailsInterface,
AlertInterface,
productDetailsInterface,
ProductFormValues,
Storage,
} from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
frontend/src/pages/Settings.tsx
+10 -11
View File
@@ -1,21 +1,20 @@
import {
Input,
Button,
CircularProgress,
Typography,
Sheet,
Chip,
Divider,
Alert,
Button,
Chip,
CircularProgress,
Divider,
Input,
Sheet,
Typography,
} from "@mui/joy";
import { useForm } from "@tanstack/react-form";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import Cookies from "js-cookie";
import { useTranslation } from "react-i18next";
import type { SettingsIntf } from "../misc/interfaces";
import type { AlertInterface } from "../misc/interfaces";
import type { AlertInterface, SettingsIntf } from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
import { mutateSettings, fetchSettings } from "../utils/api/settings";
import { fetchSettings, mutateSettings } from "../utils/api/settings";
import { useEffect, useState } from "react";
import { ChangePasswordModal } from "../components/modals/ChangePasswordModal";
@@ -90,7 +89,7 @@ export const Settings = () => {
return (
<>
<ChangePasswordModal isOpen={modal} setOpen={setModal} />
<ChangePasswordModal alert={setAlert} isOpen={modal} setOpen={setModal} />
<div className="space-y-6">
<div className="flex flex-wrap items-center gap-3">
<div className="space-y-1">
frontend/src/pages/Storages.tsx
+4 -5
View File
@@ -1,16 +1,15 @@
import { useQuery } from "@tanstack/react-query";
import { getStorages } from "../utils/api/storages";
import {
Sheet,
Table,
Alert,
Button,
CircularProgress,
Sheet,
Table,
Typography,
Alert,
} from "@mui/joy";
import { useTranslation } from "react-i18next";
import type { Storage } from "../misc/interfaces";
import type { AlertInterface } from "../misc/interfaces";
import type { AlertInterface, Storage } from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
import { StorageRow } from "../components/StorageRow";
import { useEffect, useState } from "react";
frontend/src/pages/ViewProduct.tsx
+35 -31
View File
@@ -1,26 +1,26 @@
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { getStorages } from "../utils/api/storages.ts";
import {
CircularProgress,
Typography,
Select,
Option,
Input,
Alert,
Box,
Button,
Chip,
CircularProgress,
Divider,
Box,
Alert,
Input,
Option,
Select,
Typography,
} from "@mui/joy";
import { useTranslation } from "react-i18next";
import { useEffect, useState } from "react";
import { useForm } from "@tanstack/react-form";
import { mutateProduct, getProductDetails } from "../utils/api/products.ts";
import { getProductDetails, mutateProduct } from "../utils/api/products.ts";
import { toInputDate } from "../utils/uxFncs";
import type {
ProductFormValues,
productDetailsInterface,
AlertInterface,
productDetailsInterface,
ProductFormValues,
Storage,
} from "../misc/interfaces";
import type { ApiError } from "../utils/api/apiError";
@@ -342,28 +342,32 @@ export const ViewProduct = (props: ViewProductProps) => {
</div>
</div>
</div>
<div className="flex flex-wrap items-center justify-between gap-3">
<Typography level="body-sm" className="text-slate-500">
{t("product-details")}
</Typography>
<Button
startDecorator={<QrCodeIcon />}
loading={isPending}
onClick={() => downloadQRcode()}
size="lg"
className="rounded-2xl bg-[#0b6bcb] text-white shadow-[0_16px_36px_rgba(11,107,203,0.35)] transition hover:-translate-y-0.5 hover:bg-[#095aa7]"
>
{t("download-qr-code")}
</Button>
<Button
type="submit"
loading={isPending}
size="lg"
className="rounded-2xl bg-[#0b6bcb] text-white shadow-[0_16px_36px_rgba(11,107,203,0.35)] transition hover:-translate-y-0.5 hover:bg-[#095aa7]"
>
{t("save")}
</Button>
<div>
<div className="flex gap-3 items-center">
<Typography level="body-sm" className="text-slate-500">
{t("product-details")}
</Typography>
<div className="grow"></div>
<Button
startDecorator={<QrCodeIcon />}
loading={isPending}
onClick={() => downloadQRcode()}
size="lg"
className="rounded-2xl bg-[#0b6bcb] text-white shadow-[0_16px_36px_rgba(11,107,203,0.35)] transition hover:-translate-y-0.5 hover:bg-[#095aa7]"
>
{t("download-qr-code")}
</Button>
<Button
type="submit"
loading={isPending}
size="lg"
className="rounded-2xl bg-[#0b6bcb] text-white shadow-[0_16px_36px_rgba(11,107,203,0.35)] transition hover:-translate-y-0.5 hover:bg-[#095aa7]"
>
{t("save")}
</Button>
</div>
</div>
{alert.isAlert && (
<Alert
color={alert.type}
frontend/src/utils/i18n/locales/de/de.json
+2
View File
@@ -57,6 +57,7 @@
"error": "Fehler",
"success": "Erfolg",
"submit": "Absenden",
"SU005": "Das Passwort wurde erfolgreich geändert!",
"EG001": "Ein unerwarteter Fehler ist aufgetreten. Bitte versuchen Sie es später erneut.",
"EU001": "Falscher Benutzername oder Passwort!",
"EU002": "Ihr Konto wurde deaktiviert. Bitte wenden Sie sich an einen Administrator.",
@@ -67,6 +68,7 @@
"EU007": "Passwort konnte nicht geändert werden. Bitte versuchen Sie es erneut.",
"EU008": "Ihre Einstellungen konnten nicht gespeichert werden. Bitte versuchen Sie es erneut.",
"EU009": "Ihre Einstellungen konnten nicht geladen werden. Bitte versuchen Sie es erneut.",
"EU010": "Sie müssen Ihr neues Passwort zweimal korrekt eingeben.",
"ES001": "Bitte füllen Sie alle erforderlichen Felder für den Lagerort aus.",
"ES002": "Einige erforderliche Lagerinformationen fehlen. Bitte überprüfen Sie Ihre Eingabe.",
"ES003": "Der Lagerort konnte nicht aktualisiert werden. Bitte versuchen Sie es erneut.",
frontend/src/utils/i18n/locales/en/en.json
+2
View File
@@ -57,6 +57,7 @@
"error": "Error",
"success": "Success",
"submit": "Submit",
"SU005": "Your password is updated successfully!",
"EG001": "An unexpected error occurred. Please try again later.",
"EU001": "Wrong username or password!",
"EU002": "Your account has been deactivated. Please contact an administrator.",
@@ -67,6 +68,7 @@
"EU007": "Failed to change your password. Please try again.",
"EU008": "Your settings could not be saved. Please try again.",
"EU009": "Your settings could not be loaded. Please try again.",
"EU010": "You must enter your new password twice correctly.",
"ES001": "Please fill in all required fields for the storage location.",
"ES002": "Some required storage information is missing. Please check your input.",
"ES003": "The storage location could not be updated. Please try again.",
frontend/tsconfig.app.json
+4 -1
View File
@@ -19,7 +19,10 @@
"noUnusedLocals": true,
"noUnusedParameters": true,
"erasableSyntaxOnly": true,
"noFallthroughCasesInSwitch": true
"noFallthroughCasesInSwitch": true,
"sourceMap": true,
"declaration": true,
"declarationMap": true
},
"include": ["src"]
}