fixed make commands / npm commands

Dockerfile

@@ -5,11 +5,11 @@ RUN apt-get update \
         build-essential \
         nodejs
 WORKDIR var/www/html/src/Resources
-COPY src/Resources/package.json src/Resources/yarn.lock ./
-RUN yarn install
+COPY src/Resources/package.json src/Resources/package-lock.json ./
+RUN npm install
 COPY src/Resources/ .
 COPY public .
-RUN NODE_ENV=production yarn run build
+RUN NODE_ENV=production npm run build
 
 # build production container
 FROM php:8.3-fpm-alpine

Makefile

@@ -7,23 +7,21 @@ help:
 	@echo "Available helper commands:"
 	@echo ""
 	@echo "	build              - Build an image from the Dockerfile"
-	@echo "	build-yarn         - (Re-)build production ready frontend assets i.e. CSS, JS"
-	@echo "	build-yarn-dev     - (Re-)build development ready frontend assets i.e. JS"
-	@echo "	build-yarn-dev-css - (Re-)build development ready frontend assets i.e. CSS, JS"
-	@echo "	build-yarn-watch   - (Re-)build and watch development ready frontend assets i.e. CSS, JS"
+	@echo "	build-vite         - (Re-)build production ready frontend assets i.e. CSS, JS"
+	@echo "	build-vite-dev     - (Re-)build and watch development ready frontend assets i.e. CSS, JS"
 	@echo "	create-migration   - Create Doctrine migration from code"
 	@echo "	get-users          - Get test users and their passwords"
 	@echo "	load-testdata      - Load test data i.e. dishes, meals and users"
 	@echo "	poweroff           - Stop all related containers and projects"
 	@echo "	run-devbox         - Run devbox"
-	@echo "	run-lint           - Run code linter"
+	@echo "	run-lint           - Run code frontend linter (eslint)"
 	@echo "	run-prettier-check - Run prettier with the check option"
 	@echo "	run-prettier       - Run prettier to format frontend files"
 	@echo "	run-cs-fixer       - Run Coding Standards Fixer"
 	@echo "	run-phpmd          - Run PHP Mess Detector"
 	@echo "	run-psalm          - Run static code analysis"
 	@echo "	run-tests-be       - Run backend-tests"
-	@echo "	run-tests-fe       - Run frontend-tests"
+	@echo "	run-tests-fe       - Run frontend-unit-tests"
 	@echo " run-cypress        - Run cypress"
 	@echo " run-cypress-headless - Run cypress headless"
 	@echo "	ssh                - Open a bash session in the web container"
@@ -38,26 +36,20 @@ build:
 		--tag aoepeople/meals:edge \
 		.
 
-build-yarn:
-	ddev exec yarn --cwd=src/Resources build
+build-vite:
+	ddev exec npm run --prefix src/Resources build
 
-build-yarn-dev:
-	ddev exec yarn --cwd=src/Resources build-dev
-
-build-yarn-dev-css:
-	ddev exec yarn --cwd=src/Resources build-dev-css
-
-build-yarn-watch:
-	ddev exec yarn --cwd=src/Resources build-watch
+build-vite-dev:
+	ddev exec npm run --prefix src/Resources dev
 
 run-lint:
-	ddev exec yarn --cwd src/Resources lint
+	ddev exec npm run --prefix src/Resources lint
 
 run-prettier-check:
-	ddev exec yarn --cwd src/Resources prettier-check
+	ddev exec npm run --prefix src/Resources format-check
 
 run-prettier:
-	ddev exec yarn --cwd src/Resources prettier
+	ddev exec npm run --prefix src/Resources format
 
 run-phpmd:
 	ddev exec vendor/bin/phpmd src/Mealz text ./phpmd.xml --baseline-file ./phpmd.baseline.xml --exclude */Tests/*
@@ -81,7 +73,7 @@ run-tests-be:
 	ddev run tests
 
 run-tests-fe:
-	ddev exec yarn --cwd=src/Resources test
+	ddev exec npm run --prefix src/Resources test:unit
 
 run-cypress:
 	yarn --cwd=./tests/e2e cypress open

src/Resources/package.json

@@ -7,12 +7,12 @@
   "scripts": {
     "dev": "vite",
     "build": "run-p type-check \"build-only {@}\" --",
-    "preview": "vite preview",
     "test:unit": "vitest",
     "build-only": "vite build",
     "type-check": "vue-tsc --build --force",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
-    "format": "prettier --write src/"
+    "format": "prettier --write src/",
+    "format-check": "prettier --check src/"
   },
   "dependencies": {
     "@headlessui/vue": "^1.7.13",

src/Resources/src/components/NavBar.vue

@@ -174,7 +174,9 @@ const getShowParticipationsError = computed(() => loadedState.error !== '');
 const balanceString = computed(() => userDataStore.balanceToLocalString(locale.value));
 
 const user = computed(() => userDataStore.getState().user);
-const isAuthenticated = computed(() => {!userDataStore.getState().roles.includes('ROLE_GUEST')});
+const isAuthenticated = computed(() => {
+  !userDataStore.getState().roles.includes('ROLE_GUEST');
+});
 
 const navigation = computed(() => {
   return [

src/Resources/src/components/dashboard/Day.vue

@@ -126,7 +126,7 @@ const props = defineProps<{
 const day = props.guestData ?? dashboardStore.getDay(props.weekID ?? 0, props.dayID ?? 0);
 const weekday = computed(() => {
   if (day) {
-    return translateWeekday(day.date, locale)
+    return translateWeekday(day.date, locale);
   }
   return 'unknown day';
 });
@@ -153,10 +153,10 @@ const dateString = computed(() => {
     });
   }
   return new Date().toLocaleDateString(locale.value, {
-      weekday: 'long',
-      month: 'numeric',
-      day: 'numeric'
-    })
+    weekday: 'long',
+    month: 'numeric',
+    day: 'numeric'
+  });
 });
 
 async function closeParticipantsModal() {

src/Resources/src/components/dashboard/MealCheckbox.vue

@@ -65,10 +65,13 @@ const day = props.day ?? dashboardStore.getDay(props.weekID ?? 0, props.dayID ??
 const mealOrVariation = ref<Meal>();
 let mealId: number | string;
 if (props.variationID) {
-  mealOrVariation.value = props.meal ?? dashboardStore.getVariation(props.weekID ?? 0, props.dayID ?? 0, props.mealID, props.variationID);
+  mealOrVariation.value =
+    props.meal ?? dashboardStore.getVariation(props.weekID ?? 0, props.dayID ?? 0, props.mealID, props.variationID);
   mealId = props.variationID;
 } else {
-  mealOrVariation.value = props.meal ? props.meal : dashboardStore.getMeal(props.weekID ?? 0, props.dayID ?? 0, props.mealID);
+  mealOrVariation.value = props.meal
+    ? props.meal
+    : dashboardStore.getMeal(props.weekID ?? 0, props.dayID ?? 0, props.mealID);
   mealId = props.mealID;
 }
 

src/Resources/src/stores/userDataStore.ts

@@ -31,11 +31,7 @@ class UserDataStore extends Store<UserData> {
     }
 
     private isUserdata(userData: UserData): userData is UserData {
-        return (
-            userData !== null &&
-            userData !== undefined &&
-            typeof userData.balance === 'number'
-        );
+        return userData !== null && userData !== undefined && typeof userData.balance === 'number';
     }
 
     public roleAllowsRoute(routeName: string): boolean {

src/Resources/src/views/Guest.vue

@@ -43,12 +43,12 @@ import GuestForm from '@/components/guest/GuestForm.vue';
 import Day from '@/components/dashboard/Day.vue';
 
 interface IForm {
-  firstName: string,
-  lastName: string,
-  company: string,
-  chosenSlot: number,
-  chosenMeals: string[],
-  combiDishes: string[]
+  firstName: string;
+  lastName: string;
+  company: string;
+  chosenSlot: number;
+  chosenMeals: string[];
+  combiDishes: string[];
 }
 
 const progress = useProgress().start();
@@ -65,14 +65,10 @@ const form = reactive<IForm>({
   chosenSlot: 0,
   chosenMeals: [],
   combiDishes: []
-})
+});
 
 const filled = computed(
-  () =>
-    form.firstName !== '' &&
-    form.lastName !== '' &&
-    form.company !== '' &&
-    form.chosenMeals.length !== 0
+  () => form.firstName !== '' && form.lastName !== '' && form.company !== '' && form.chosenMeals.length !== 0
 );
 const firstNameMissing = ref(false);
 const lastNameMissing = ref(false);