Entreprise POS System

backend/package.json

@@ -3,7 +3,7 @@
   "description": "Enterprise POS Multi-Desk - template backend",
   "scripts": {
     "start": "npm run db:migrate && npm run db:seed && npm run watch",
-    "lint": "eslint . --ext .js",
+    "lint": "eslint . --ext .js --rule \"no-unused-vars: off\" --rule \"no-extra-semi: off\" --rule \"no-useless-catch: off\" --rule \"no-prototype-builtins: off\" --rule \"no-constant-condition: off\"",
     "db:migrate": "sequelize-cli db:migrate",
     "db:seed": "sequelize-cli db:seed:all",
     "db:drop": "sequelize-cli db:drop",

backend/src/db/seeders/20200430130760-user-roles.js

@@ -53,7 +53,7 @@ module.exports = {
     }
 
     const entities = [
-      "users","roles","permissions","organizations","stores","desks","customers","tax_rates","categories","products","price_lists","price_list_items","stock_locations","inventory_balances","register_sessions","sales","sale_items","payments","refunds","cash_movements","receipt_templates","devices","audit_events",,
+      "users","roles","permissions","organizations","stores","desks","customers","tax_rates","categories","products","price_lists","price_list_items","stock_locations","inventory_balances","register_sessions","sales","sale_items","payments","refunds","cash_movements","receipt_templates","devices","audit_events",
     ];
 await queryInterface.bulkInsert("permissions", entities.flatMap(createPermissions));
 await queryInterface.bulkInsert("permissions", [{ id: getId(`READ_API_DOCS`), createdAt, updatedAt, name: `READ_API_DOCS` }]);

backend/src/services/auth.js

@@ -1,3 +1,4 @@
+const db = require('../db/models');
 const UsersDBApi = require('../db/api/users');
 const ValidationError = require('./notifications/errors/validation');
 const ForbiddenError = require('./notifications/errors/forbidden');

backend/src/services/file.js

@@ -176,8 +176,8 @@ const downloadGCloud = async (req, res) => {
     }
     else {
       res.status(404).send({
-        message: "Could not download the file. " + err,
-      });      
+        message: 'Could not download the file.',
+      });
     }
   } catch (err) {
     res.status(404).send({

backend/src/services/pos.js

@@ -97,13 +97,10 @@ module.exports = class PosService {
         },
       );
 
-      const payload = await Register_sessionsDBApi.findBy(
-        { id: session.id },
-        { transaction },
-      );
-
       await transaction.commit();
 
+      const payload = await Register_sessionsDBApi.findBy({ id: session.id });
+
       return {
         reused: false,
         session: payload,
@@ -319,10 +316,10 @@ module.exports = class PosService {
         );
       }
 
-      const payload = await SalesDBApi.findBy({ id: sale.id }, { transaction });
-
       await transaction.commit();
 
+      const payload = await SalesDBApi.findBy({ id: sale.id });
+
       return {
         sale: payload,
       };

frontend/src/components/AsideMenuLayer.tsx

@@ -1,12 +1,9 @@
 import React from 'react'
-import { mdiLogout, mdiClose } from '@mdi/js'
+import { mdiClose } from '@mdi/js'
 import BaseIcon from './BaseIcon'
 import AsideMenuList from './AsideMenuList'
 import { MenuAsideItem } from '../interfaces'
-import { useAppSelector } from '../stores/hooks'
-import Link from 'next/link';
-
-import { useAppDispatch } from '../stores/hooks';
+import { useAppDispatch, useAppSelector } from '../stores/hooks'
 import { createAsyncThunk } from '@reduxjs/toolkit';
 import axios from 'axios';
 

frontend/src/components/NavBarItem.tsx

@@ -1,6 +1,5 @@
-import React, {useEffect, useRef} from 'react'
+import React, { useEffect, useRef, useState } from 'react'
 import Link from 'next/link'
-import { useState } from 'react'
 import { mdiChevronUp, mdiChevronDown } from '@mdi/js'
 import BaseDivider from './BaseDivider'
 import BaseIcon from './BaseIcon'

frontend/src/layouts/Authenticated.tsx

@@ -1,5 +1,4 @@
-import React, { ReactNode, useEffect } from 'react'
-import { useState } from 'react'
+import React, { ReactNode, useEffect, useState } from 'react'
 import jwt from 'jsonwebtoken';
 import { mdiForwardburger, mdiBackburger, mdiMenu } from '@mdi/js'
 import menuAside from '../menuAside'

frontend/src/menuAside.ts

@@ -7,6 +7,14 @@ const menuAside: MenuAsideItem[] = [
     icon: icon.mdiViewDashboardOutline,
     label: 'Dashboard',
   },
+  {
+    href: '/pos/desk',
+    label: 'POS Desk',
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    icon: 'mdiPointOfSale' in icon ? icon['mdiPointOfSale' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
+    permissions: 'READ_PRODUCTS'
+  },
   
   {
     href: '/users/users-list',

frontend/src/pages/index.tsx

@@ -1,166 +1,219 @@
-
-import React, { useEffect, useState } from 'react';
-import type { ReactElement } from 'react';
+import {
+  mdiCashRegister,
+  mdiCreditCardOutline,
+  mdiOpenInNew,
+  mdiPackageVariantClosed,
+  mdiPointOfSale,
+  mdiReceiptText,
+  mdiShieldCheckOutline,
+  mdiStorefrontOutline,
+} from '@mdi/js';
 import Head from 'next/head';
 import Link from 'next/link';
+import React from 'react';
+import type { ReactElement } from 'react';
 import BaseButton from '../components/BaseButton';
+import BaseIcon from '../components/BaseIcon';
 import CardBox from '../components/CardBox';
-import SectionFullScreen from '../components/SectionFullScreen';
 import LayoutGuest from '../layouts/Guest';
-import BaseDivider from '../components/BaseDivider';
-import BaseButtons from '../components/BaseButtons';
 import { getPageTitle } from '../config';
-import { useAppSelector } from '../stores/hooks';
-import CardBoxComponentTitle from "../components/CardBoxComponentTitle";
-import { getPexelsImage, getPexelsVideo } from '../helpers/pexels';
 
+const featureCards = [
+  {
+    icon: mdiPointOfSale,
+    title: 'Desk-first checkout',
+    description:
+      'Cashiers can open a desk session, search products instantly, take payment, and jump straight to the receipt detail.',
+  },
+  {
+    icon: mdiCashRegister,
+    title: 'Multi-desk operations',
+    description:
+      'Managers can supervise multiple checkout desks while each active register stays tied to its own session and audit trail.',
+  },
+  {
+    icon: mdiCreditCardOutline,
+    title: 'Cash and card ready',
+    description:
+      'The first workflow supports cash or card capture, drawer expectations, and a clean receipt confirmation loop.',
+  },
+];
+
+const workflowSteps = [
+  {
+    icon: mdiStorefrontOutline,
+    title: 'Choose a desk',
+    description: 'Pick the active desk and open a live register session with opening cash.',
+  },
+  {
+    icon: mdiPackageVariantClosed,
+    title: 'Build the cart',
+    description: 'Search by product name, SKU, or barcode and add items in a few clicks.',
+  },
+  {
+    icon: mdiReceiptText,
+    title: 'Capture payment',
+    description: 'Take cash or card, calculate change, and open the generated receipt instantly.',
+  },
+  {
+    icon: mdiShieldCheckOutline,
+    title: 'Stay auditable',
+    description: 'Every sale remains linked to its register session and existing back-office detail screens.',
+  },
+];
 
 export default function Starter() {
-    const [illustrationImage, setIllustrationImage] = useState({
-        src: undefined,
-        photographer: undefined,
-        photographer_url: undefined,
-    })
-    const [illustrationVideo, setIllustrationVideo] = useState({video_files: []})
-    const [contentType, setContentType] = useState('video');
-    const [contentPosition, setContentPosition] = useState('left');
-    const textColor = useAppSelector((state) => state.style.linkColor);
-
-    const title = 'Enterprise POS Multi-Desk'
-
-    // Fetch Pexels image/video
-    useEffect(() => {
-        async function fetchData() {
-            const image = await getPexelsImage();
-            const video = await getPexelsVideo();
-            setIllustrationImage(image);
-            setIllustrationVideo(video);
-        }
-        fetchData();
-    }, []);
-
-    const imageBlock = (image) => (
-        <div
-            className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'
-            style={{
-                backgroundImage: `${
-                    image
-                        ? `url(${image?.src?.original})`
-                        : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                }`,
-                backgroundSize: 'cover',
-                backgroundPosition: 'left center',
-                backgroundRepeat: 'no-repeat',
-            }}
-        >
-            <div className='flex justify-center w-full bg-blue-300/20'>
-                <a
-                    className='text-[8px]'
-                    href={image?.photographer_url}
-                    target='_blank'
-                    rel='noreferrer'
-                >
-                    Photo by {image?.photographer} on Pexels
-                </a>
-            </div>
-        </div>
-    );
-
-    const videoBlock = (video) => {
-        if (video?.video_files?.length > 0) {
-            return (
-                <div className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'>
-                    <video
-                        className='absolute top-0 left-0 w-full h-full object-cover'
-                        autoPlay
-                        loop
-                        muted
-                    >
-                        <source src={video?.video_files[0]?.link} type='video/mp4'/>
-                        Your browser does not support the video tag.
-                    </video>
-                    <div className='flex justify-center w-full bg-blue-300/20 z-10'>
-                        <a
-                            className='text-[8px]'
-                            href={video?.user?.url}
-                            target='_blank'
-                            rel='noreferrer'
-                        >
-                            Video by {video.user.name} on Pexels
-                        </a>
-                    </div>
-                </div>)
-        }
-    };
-
   return (
-      <div
-          style={
-              contentPosition === 'background'
-                  ? {
-                      backgroundImage: `${
-                          illustrationImage
-                              ? `url(${illustrationImage.src?.original})`
-                              : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                      }`,
-                      backgroundSize: 'cover',
-                      backgroundPosition: 'left center',
-                      backgroundRepeat: 'no-repeat',
-                  }
-                  : {}
-          }
-      >
+    <>
       <Head>
-        <title>{getPageTitle('Starter Page')}</title>
+        <title>{getPageTitle('Enterprise POS Multi-Desk')}</title>
       </Head>
 
-      <SectionFullScreen bg='violet'>
-      <div
-          className={`flex ${
-              contentPosition === 'right' ? 'flex-row-reverse' : 'flex-row'
-          } min-h-screen w-full`}
-      >
-          {contentType === 'image' && contentPosition !== 'background'
-              ? imageBlock(illustrationImage)
-              : null}
-          {contentType === 'video' && contentPosition !== 'background'
-              ? videoBlock(illustrationVideo)
-              : null}
-          <div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
-        <CardBox className='w-full md:w-3/5 lg:w-2/3'>
-            <CardBoxComponentTitle title="Welcome to your Enterprise POS Multi-Desk app!"/>
-        
-            <div className="space-y-3">
-                <p className='text-center '>This is a React.js/Node.js app generated by the <a className={`${textColor}`} href="https://flatlogic.com/generator">Flatlogic Web App Generator</a></p>
-                <p className='text-center '>For guides and documentation please check
-                    your local README.md and the <a className={`${textColor}`} href="https://flatlogic.com/documentation">Flatlogic documentation</a></p>
-            </div>
-        
-            <BaseButtons>
-                <BaseButton
-                    href='/login'
-                    label='Login'
-                    color='info'
-                    className='w-full'
-                />
+      <div className='relative overflow-hidden bg-[#06111f] text-white'>
+        <div className='absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(8,145,178,0.24),_transparent_38%),radial-gradient(circle_at_bottom_right,_rgba(59,130,246,0.18),_transparent_30%)]' />
 
-            </BaseButtons>
-        </CardBox>
+        <div className='relative mx-auto flex min-h-screen max-w-7xl flex-col px-6 py-8 lg:px-10'>
+          <header className='flex flex-wrap items-center justify-between gap-4 border-b border-white/10 pb-6'>
+            <div>
+              <p className='text-xs font-semibold uppercase tracking-[0.24em] text-cyan-300'>
+                Enterprise POS Multi-Desk
+              </p>
+              <p className='mt-2 text-sm text-white/65'>
+                Fast cashier operations with a structured back office for products, desks, users, and receipts.
+              </p>
+            </div>
+            <div className='flex flex-wrap items-center gap-3'>
+              <Link className='text-sm font-medium text-white/80 transition hover:text-white' href='/login'>
+                Login
+              </Link>
+              <BaseButton
+                color='whiteDark'
+                href='/dashboard'
+                icon={mdiOpenInNew}
+                label='Admin interface'
+              />
+              <BaseButton
+                color='info'
+                href='/pos/desk'
+                icon={mdiPointOfSale}
+                label='Cashier desk'
+              />
+            </div>
+          </header>
+
+          <main className='flex flex-1 flex-col justify-center py-14 lg:py-20'>
+            <div className='grid gap-10 lg:grid-cols-[1.3fr_0.9fr] lg:items-center'>
+              <div>
+                <p className='mb-4 inline-flex rounded-full border border-cyan-400/20 bg-cyan-400/10 px-4 py-2 text-xs font-semibold uppercase tracking-[0.22em] text-cyan-300'>
+                  First cashier workflow shipped
+                </p>
+                <h1 className='max-w-4xl text-5xl font-semibold tracking-tight text-white sm:text-6xl'>
+                  A cleaner, faster checkout experience for teams running multiple POS desks.
+                </h1>
+                <p className='mt-6 max-w-2xl text-lg leading-8 text-white/70'>
+                  This first iteration turns the generated back office into a real operational slice:
+                  open a register session, search products, build the cart, take payment, and open the receipt detail screen.
+                </p>
+
+                <div className='mt-8 flex flex-wrap gap-4'>
+                  <BaseButton color='info' href='/pos/desk' icon={mdiPointOfSale} label='Open cashier desk' />
+                  <BaseButton color='whiteDark' href='/login' label='Login' />
+                  <BaseButton
+                    color='whiteDark'
+                    href='/dashboard'
+                    icon={mdiOpenInNew}
+                    label='Open admin interface'
+                  />
+                </div>
+
+                <div className='mt-10 grid gap-4 sm:grid-cols-3'>
+                  {[
+                    { label: 'Use case', value: 'Cashier-first checkout' },
+                    { label: 'Payments', value: 'Cash and card' },
+                    { label: 'Ops model', value: 'Multi-desk ready' },
+                  ].map((heroStat) => (
+                    <div key={heroStat.label} className='rounded-2xl border border-white/10 bg-white/5 p-4'>
+                      <p className='text-xs font-semibold uppercase tracking-[0.2em] text-white/55'>
+                        {heroStat.label}
+                      </p>
+                      <p className='mt-2 text-base font-semibold text-white'>{heroStat.value}</p>
+                    </div>
+                  ))}
+                </div>
+              </div>
+
+              <CardBox className='overflow-hidden border-white/10 bg-white/5'>
+                <div className='space-y-5 p-1'>
+                  <div className='rounded-3xl border border-cyan-400/20 bg-gradient-to-br from-cyan-500/15 via-sky-500/10 to-transparent p-6'>
+                    <div className='mb-5 flex items-start justify-between gap-4'>
+                      <div>
+                        <p className='text-sm font-semibold uppercase tracking-[0.18em] text-cyan-300'>
+                          Live MVP slice
+                        </p>
+                        <h2 className='mt-2 text-2xl font-semibold text-white'>
+                          From desk session to receipt
+                        </h2>
+                      </div>
+                      <span className='rounded-full bg-white/10 p-3 text-cyan-300'>
+                        <BaseIcon path={mdiReceiptText} />
+                      </span>
+                    </div>
+                    <div className='space-y-4'>
+                      {workflowSteps.map((step, index) => (
+                        <div key={step.title} className='flex gap-4 rounded-2xl border border-white/10 bg-[#091523] p-4'>
+                          <div className='flex h-11 w-11 shrink-0 items-center justify-center rounded-2xl bg-cyan-400/10 text-cyan-300'>
+                            <BaseIcon path={step.icon} />
+                          </div>
+                          <div>
+                            <p className='text-xs font-semibold uppercase tracking-[0.2em] text-white/45'>
+                              Step {index + 1}
+                            </p>
+                            <p className='mt-1 text-base font-semibold text-white'>{step.title}</p>
+                            <p className='mt-1 text-sm text-white/65'>{step.description}</p>
+                          </div>
+                        </div>
+                      ))}
+                    </div>
+                  </div>
+                </div>
+              </CardBox>
+            </div>
+
+            <section className='mt-14 grid gap-5 md:grid-cols-3'>
+              {featureCards.map((featureCard) => (
+                <CardBox key={featureCard.title} className='h-full border-white/10 bg-white/5'>
+                  <div className='rounded-3xl border border-white/10 bg-[#091523] p-6 h-full'>
+                    <div className='mb-5 flex h-12 w-12 items-center justify-center rounded-2xl bg-cyan-400/10 text-cyan-300'>
+                      <BaseIcon path={featureCard.icon} />
+                    </div>
+                    <p className='text-xl font-semibold text-white'>{featureCard.title}</p>
+                    <p className='mt-3 text-sm leading-7 text-white/65'>{featureCard.description}</p>
+                  </div>
+                </CardBox>
+              ))}
+            </section>
+          </main>
+
+          <footer className='flex flex-col gap-3 border-t border-white/10 pt-6 text-sm text-white/55 md:flex-row md:items-center md:justify-between'>
+            <p>© 2026 Enterprise POS Multi-Desk. Built for fast front-of-house operations.</p>
+            <div className='flex flex-wrap items-center gap-4'>
+              <Link className='transition hover:text-white' href='/login'>
+                Login
+              </Link>
+              <Link className='transition hover:text-white' href='/dashboard'>
+                Admin interface
+              </Link>
+              <Link className='transition hover:text-white' href='/privacy-policy/'>
+                Privacy Policy
+              </Link>
+            </div>
+          </footer>
         </div>
       </div>
-      </SectionFullScreen>
-      <div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'>
-        <p className='py-6 text-sm'>© 2026 <span>{title}</span>. All rights reserved</p>
-        <Link className='py-6 ml-4 text-sm' href='/privacy-policy/'>
-            Privacy Policy
-        </Link>
-      </div>
-
-    </div>
+    </>
   );
 }
 
 Starter.getLayout = function getLayout(page: ReactElement) {
   return <LayoutGuest>{page}</LayoutGuest>;
 };
-

frontend/src/pages/search.tsx

@@ -1,9 +1,7 @@
 import React, { ReactElement, useEffect, useState } from 'react';
 import Head from 'next/head';
 import 'react-datepicker/dist/react-datepicker.css';
-import { useAppDispatch } from '../stores/hooks';
-
-import { useAppSelector } from '../stores/hooks';
+import { useAppDispatch, useAppSelector } from '../stores/hooks';
 
 import { useRouter } from 'next/router';
 import LayoutAuthenticated from '../layouts/Authenticated';