data-primals-engine 1.3.3 → 1.4.0

package/client/src/DataEditor.jsx

@@ -8,10 +8,10 @@ import RelationField from "./RelationField.jsx";
 import {
     CheckboxField,
     CodeField,
-    ColorField, EmailField,
+    ColorField, DurationField, EmailField,
     EnumField,
     FileField, ModelField, NumberField,
-    PhoneField,
+    PhoneField, RangeField,
     SelectField,
     TextField
 } from "./Field.jsx";
@@ -212,6 +212,24 @@ export const DataEditor = forwardRef(function MyDataEditor({
                     }}/></>;
                 }
             case "number":
+                if (field.type === 'number' && field.gauge) {
+                    return <RangeField
+                        name={field.name}
+                        value={value}
+                        onChange={(value) => handleChange({name: field.name, value})}
+                        min={field.min}
+                        max={field.max}
+                        percent={field.percent}
+                        step={field.step || 1}
+                    />;
+                }
+                if (field.delay) {
+                    return <DurationField
+                        {...inputProps}
+                        // DurationField's onChange provides an object: { name, value }
+                        onChange={({ value }) => handleChange({name: field.name, value})}
+                    />;
+                }
                 inputProps["step"] = field.step || 0.1;
                 if( field.min )
                     inputProps["min"] = field.min;

package/client/src/DataLayout.jsx

@@ -9,9 +9,10 @@ import {Pagination} from "./Pagination.jsx";
 import {Event} from "../../src/events.js";
 
 import {
+    FaEye,
     FaFilter, FaInfo,
 } from "react-icons/fa";
-import {getDefaultForType, getUserId} from "../../src/data.js";
+import {getDefaultForType, getUserHash, getUserId} from "../../src/data.js";
 import {Trans, useTranslation} from "react-i18next";
 
 import {getObjectHash} from "../../src/core.js";
@@ -32,6 +33,8 @@ import KanbanConfigModal from "./KanbanConfigModal.jsx";
 import CalendarConfigModal from "./CalendarConfigModal.jsx";
 import KanbanView from "./KanbanView.jsx";
 import CalendarView from "./CalendarView.jsx";
+import {useLocation, useParams, useSearchParams} from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
 
 const NotConfiguredPlaceholder = ({ type, onConfigure }) => (
@@ -44,7 +47,8 @@ const NotConfiguredPlaceholder = ({ type, onConfigure }) => (
     </div>
 );
 
-function DataLayout() {
+function DataLayout({refreshUI}) {
+    const [ searchParams, setSearchParams ] = useSearchParams();
     const [viewSettings, setViewSettings] = useLocalStorage('viewSettings', {});
 
     const [isCalendarModalOpen, setCalendarModalOpen] = useState(false);
@@ -68,7 +72,8 @@ function DataLayout() {
         pagedFilters, pagedSort,
         elementsPerPage,
         setRelations,
-        generatedModels
+        generatedModels,
+        models
     } = useModelContext(); // Utilisez le contexte
     const queryClient = useQueryClient();
 
@@ -86,6 +91,28 @@ function DataLayout() {
     const [editionMode, setEditionMode] = useState(false);
     const [showDataEditor, setDataEditorVisible] = useState(false);
     const [showAPIInfo, setAPIInfoVisible] = useState(false);
+    const nav = useNavigate();
+    const mod = searchParams.get('model');
+    const loc = useLocation();
+    useEffect(() =>{
+        if (selectedModel?.name) {
+            nav('/user/' + getUserHash(me) + '/?model=' + selectedModel?.name);
+        }
+    }, [selectedModel?.name])
+
+
+    useEffect(() => {
+        setSelectedModel(null)
+        setDataEditorVisible(false);
+        setAPIInfoVisible(false);
+        setEditionMode(true);
+    }, []);
+
+    useEffect(() =>{
+        setSelectedModel(models.find(f => f.name === mod));
+        setEditionMode(false);
+    }, [mod, models, searchParams])
+
 
     // La vue courante est dérivée du modèle sélectionné et des préférences stockées.
     const currentView = useMemo(() => {
@@ -426,13 +453,6 @@ function DataLayout() {
         queryClient.invalidateQueries(['api/data', model.name, r]);
     }
 
-    useEffect(() => {
-            setSelectedModel(null)
-            setDataEditorVisible(false);
-            setAPIInfoVisible(false);
-            setEditionMode(true);
-    }, []);
-
     const deleteMutation = useMutation((selectedModels) => {
         return fetch('/api/data/'+checkedItems.map(m => m._id).join(',')+'?lang='+lang+'&_user='+encodeURIComponent(getUserId(me)), {
             method: 'DELETE', headers: {
@@ -530,7 +550,7 @@ function DataLayout() {
 
 
     const [currentProfile, setCurrentProfile] = useLocalStorage('profile', null);
-    const {isTourOpen, setIsTourOpen, currentTourSteps, allTourSteps, setTourStepIndex, setCurrentTourSteps, currentTour,setCurrentTour} = useUI();
+    const {isTourOpen, setIsTourOpen, currentTourSteps, allTourSteps, setTourStepIndex, setCurrentTourSteps, currentTour,setCurrentTour, addLaunchedTour} = useUI();
 
     const startTour = () => {
         setIsTourOpen(true);
@@ -538,12 +558,28 @@ function DataLayout() {
 
     const closeTour = (completedTourName) => {
         // On génère le nom du tour de démo pour le comparer
+        // This function is called when ANY tour is closed.
+        // It needs to persist the fact that the tour has been seen.
+
+        // 1. Add the tour's unique name to the list of launched tours.
+        // This list is managed by the UI context and stored in localStorage.
+        if (addLaunchedTour) { // Check if the function exists to be safe
+            addLaunchedTour(completedTourName);
+        }
+
+        // 2. Close the tour's UI.
+        setIsTourOpen(false);
+
+        // 3. Specific logic for the very first "demo" tour:
+        // We also set the user's profile to mark that they are no longer a brand new user.
+        // This prevents the demo tour from trying to launch on every page load.
         const demoTourName = `tour_${getObjectHash({steps: allTourSteps.demo || []})}`;
 
         // Si le tour qui vient de se terminer est le tour de démo
         if (completedTourName === demoTourName) {
 
             setIsTourOpen(false);
+            setCurrentProfile({ lastSeen: new Date().toISOString() });
         }
     };
 
@@ -660,10 +696,15 @@ function DataLayout() {
                         onConfigureView={handleConfigureCurrentView}
                     />}
                     <h2>{t(`model_${selectedModel?.name}`, selectedModel?.name)} <>({countByModel?.[selectedModel?.name]})</></h2>
-                    {t(`model_${selectedModel?.name}`, selectedModel?.name) !== selectedModel?.name && (
+
+                    <div className={"flex"}>
+                        {t(`model_${selectedModel?.name}`, selectedModel?.name) !== selectedModel?.name && (
                         <span className="badge"><strong>model</strong> : {selectedModel?.name}</span>)}
+                    {selectedModel.name === 'dashboard' && <button onClick={() => {
+                        nav('/user/'+getUserHash(me)+'/dashboards');
+                    }}><FaEye /> Afficher les tableaux de bord</button> }
+                    </div>
                     <p className="model-desc hint">{t(`model_description_${selectedModel.name}`, selectedModel.description)}</p>
-
                     {renderCurrentView()}
 
                     {isDataLoaded && currentView === 'table'  && (<>