data-primals-engine 1.3.3 → 1.4.0

package/client/package.json

@@ -12,61 +12,62 @@
     "preview": "vite preview"
   },
   "peerDependencies": {
-    "@tiptap/react": "^2.11.5",
+    "@tiptap/react": "^2.26.1",
     "react-chartjs-2": "^5.3.0",
     "react-code-blocks": "^0.1.6",
-    "react-cookie": "^8.0.0",
+    "react-cookie": "^8.0.1",
     "react-ga": "^3.3.1",
     "react-helmet": "^6.1.0",
-    "react-icons": "^5.0.1",
-    "react-international-phone": "^4.5.0",
+    "react-icons": "^5.5.0",
+    "react-international-phone": "^4.6.0",
     "react-query": "^3.39.3",
-    "react-router-dom": "^7.1.5",
+    "react-router-dom": "^7.8.1",
     "react-syntax-highlighter": "^15.6.1",
-    "react-tooltip": "^5.28.1"
+    "react-tooltip": "^5.29.1"
   },
   "dependencies": {
-    "@babel/runtime": "^7.24.7",
+    "@babel/runtime": "^7.28.3",
     "@codeium/react-code-editor": "^1.0.12",
-    "@codemirror/lang-javascript": "^6.2.3",
-    "@tiptap/extension-code": "^2.12.0",
-    "@tiptap/extension-code-block": "^2.12.0",
-    "@tiptap/extension-code-block-lowlight": "^2.12.0",
-    "@tiptap/extension-color": "^2.11.5",
-    "@tiptap/extension-hard-break": "^2.12.0",
+    "@codemirror/lang-javascript": "^6.2.4",
+    "@tiptap/extension-code": "^2.26.1",
+    "@tiptap/extension-code-block": "^2.26.1",
+    "@tiptap/extension-code-block-lowlight": "^2.26.1",
+    "@tiptap/extension-color": "^2.26.1",
+    "@tiptap/extension-hard-break": "^2.26.1",
     "@tiptap/extension-image": "^2.12.0",
-    "@tiptap/extension-link": "^2.12.0",
-    "@tiptap/extension-list-item": "^2.11.5",
-    "@tiptap/extension-text-style": "^2.11.5",
-    "@tiptap/pm": "^2.11.5",
-    "@tiptap/starter-kit": "^2.11.5",
-    "@uiw/react-codemirror": "^4.23.10",
-    "chart.js": "^4.4.9",
+    "@tiptap/extension-link": "^2.26.1",
+    "@tiptap/extension-list-item": "^2.26.1",
+    "@tiptap/extension-text-style": "^2.26.1",
+    "@tiptap/pm": "^2.26.1",
+    "@tiptap/starter-kit": "^2.26.1",
+    "@uiw/react-codemirror": "^4.25.1",
+    "chart.js": "^4.5.0",
     "chartjs-adapter-date-fns": "^3.0.0",
     "classnames": "^2.5.1",
     "date-fns": "^4.1.0",
     "express-rate-limit": "^7.5.1",
+    "i18next": "^25.4.0",
     "lowlight": "^3.3.0",
-    "react": "18.3.1",
+    "react": "^18.3.1",
     "react-big-calendar": "^1.15.0",
-    "react-dom": "18.3.1",
-    "react-router": "^7.2.0",
-    "react-switch": "^6.1.0",
+    "react-dom": "^18.3.1",
+    "react-router": "^7.8.1",
+    "react-switch": "^7.1.0",
     "uniqid": "^5.4.0",
-    "yet-another-react-lightbox": "^3.22.0"
+    "yet-another-react-lightbox": "^3.25.0"
   },
   "devDependencies": {
-    "@eslint/js": "^9.17.0",
-    "@types/react": "18.3.1",
-    "@types/react-dom": "18.3.1",
-    "@vitejs/plugin-react": "^4.3.4",
-    "eslint": "^9.17.0",
-    "eslint-plugin-react": "^7.37.2",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "eslint-plugin-react-refresh": "^0.4.16",
-    "globals": "^15.14.0",
+    "@eslint/js": "^9.33.0",
+    "@types/react": "^18.3.1",
+    "@types/react-dom": "^18.3.1",
+    "@vitejs/plugin-react": "^4.7.0",
+    "eslint": "^9.33.0",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
+    "globals": "^15.15.0",
     "process": "^0.11.10",
-    "sass-embedded": "^1.83.4",
-    "vite": "^6.1.1"
+    "sass-embedded": "^1.90.0",
+    "vite": "^6.3.5"
   }
 }

package/client/src/App.jsx

@@ -4,7 +4,6 @@ import "yet-another-react-lightbox/plugins/captions.css";
 import "yet-another-react-lightbox/styles.css";
 import "./App.scss";
 import {QueryClient, QueryClientProvider, useMutation, useQuery} from "react-query";
-
 import {
     BrowserRouter,
     Outlet,
@@ -85,7 +84,7 @@ function TopBar({header}) {
     return <>{header}</>;
 }
 
-function Layout ({header, routes, body, footer}) {
+function Layout ({header, routes, body, footer,refreshUI}) {
     const [cookies, setCookie, removeCookie] = useCookies(['username']);
     const { i18n, t } = useTranslation();
     const lang = (i18n.resolvedLanguage || i18n.language).split(/[-_]/)?.[0];
@@ -189,8 +188,6 @@ function Layout ({header, routes, body, footer}) {
     }
 
 
-    const [refreshReducer, refreshUI]= useReducer((n) => n+1, 0,() => 0);
-
     const nav = useNavigate();
 
     const [red, triggerSignin] = useReducer((d) => d+1, 0, () => 0);
@@ -392,12 +389,12 @@ function Layout ({header, routes, body, footer}) {
 
                 <Route path="/user/:user/dashboards/:hash?" element={<>
                     {menu}
-                    {me && <DashboardsPage />}
+                    {<DashboardsPage />}
                 </>} />
 
                 <Route path={"/user/:user/*"} element={<>
                     {menu}
-                    <UserPage notifs={[]} onAuthenticated={onAuthenticated} triggerSignin={triggerSignin}/>
+                    <UserPage notifs={[]} refreshUI={refreshUI} onAuthenticated={onAuthenticated} triggerSignin={triggerSignin}/>
                     {!me && (<></>)}
                 </>}/>
                 <Route path={"/:lang/*"} element={<>
@@ -415,7 +412,7 @@ function Layout ({header, routes, body, footer}) {
     </div>;
 }
 
-function UserPage({notifs,triggerSignin, onAuthenticated}) {
+function UserPage({notifs,triggerSignin,refreshUI, onAuthenticated}) {
     const {me} = useAuthContext()
     const [cookies, setCookie, removeCookie] = useCookies(['username']);
     const params = useParams();
@@ -515,7 +512,7 @@ function UserPage({notifs,triggerSignin, onAuthenticated}) {
     }, [isDemo, shouldStartTour]);
 
     return <>{/^demo[0-9]{1,2}$/.test(me?.username) && notifs}
-        {params.user === id && <DataLayout/>}
+        {params.user === id && <DataLayout refreshUI={refreshUI}/>}
         {params.user !== id &&
             <p>Veuillez vous authentifier avec cet utilisateur &quot;{params.user}&quot; pour accéder à vos
                 données</p>}</>;
@@ -532,6 +529,8 @@ const BaseLayout=()=>{
     const { me, setMe } = useAuthContext();
     const [translations, setTranslations] = useState([]);
 
+    const [refreshReducer, refreshUI]= useReducer((n) => n+1, 0,() => 0);
+
     useEffect(() => {
         if (Array.isArray(translations)) {
             var trs= {};
@@ -565,7 +564,7 @@ const BaseLayout=()=>{
         changeLanguage(lang);
     }, [lang]);
 
-    return <Layout header={<header className={"flex"}>
+    return <Layout refreshUI={refreshUI} header={<header className={"flex"}>
         <Tooltip id={"header"}/>
         <h1 className="flex-1">{seoTitle}</h1>
         <div className="center">
@@ -590,7 +589,7 @@ function App() {
                             <BrowserRouter>
                                 <UIProvider>
                                     <NotificationProvider>
-                                        <BaseLayout></BaseLayout>x
+                                        <BaseLayout></BaseLayout>
                                     </NotificationProvider>
                                 </UIProvider>
                             </BrowserRouter>

package/client/src/App.scss

@@ -245,6 +245,7 @@ form, .form {
     border-radius: 5px;
     box-sizing: border-box;
     transition: border-color 0.3s ease, box-shadow 0.3s ease;
+    font-family: "Nunito Sans", sans-serif;
     &:focus, &:-webkit-autofill {
       border-color: $secondary-color;
       background-color: #eaeaea !important;
@@ -268,6 +269,11 @@ form, .form {
     max-width: 150px;
   }
 
+  input[type*=date] {
+    padding: 4px 8px;
+    font-size: 80%;
+  }
+
   .btn {
     background-color: $primary-color;
     color: white;
@@ -1296,7 +1302,7 @@ select[multiple]{
 
 .model-creator {
   .field-checkbox {
-    padding: 8px;
+    padding: 2px;
     display: flex;
     gap: 8px;
     align-items: flex-start;
@@ -1505,3 +1511,38 @@ select[multiple]{
 }
 
 
+// Styles for TextField with suggestions
+.with-suggestions {
+  position: relative;
+}
+
+.suggestions-list {
+  position: absolute;
+  background-color: white;
+  border: 1px solid #ccc;
+  border-top: none;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  z-index: 1000; // High z-index to appear over other elements
+  max-height: 250px;
+  overflow-y: auto;
+  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+  border-radius: 0 0 4px 4px;
+
+  li {
+    padding: 8px 12px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: 0.9rem;
+
+    &:hover {
+      background-color: #f0f8ff; // A light blue hover
+    }
+  }
+}
+
+