Closed #864 and fixed error with check device screen size (#873)

linea-it · Feb 23, 2024 · a3bf783 · a3bf783
1 parent 0f86ab8
commit a3bf783
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/frontend/src/components/PredictionEventsDataGrid/Toolbar.js b/frontend/src/components/PredictionEventsDataGrid/Toolbar.js
@@ -12,10 +12,10 @@ import useBreakpoint from '../../hooks/useBreakpoint';
 
 function PredictEventToolbar({ }) {
 
-  const { viewLayoyt, setViewLayoyt } = useContext(PredictionEventsContext)
-  const currentBreakpoint = useBreakpoint()
-  const isMobile = ['xs', 'sm'].indexOf(currentBreakpoint.getBreakPointName()) !== -1 ? true : false
-
+  const { viewLayoyt, setViewLayoyt, isMobile } = useContext(PredictionEventsContext)
+  // const currentBreakpoint = useBreakpoint()
+  // const isMobile = ['xs', 'sm', 'md', 'lg'].indexOf(currentBreakpoint.getBreakPointName()) !== -1 ? true : false
+  // console.log("isMobile: %o", isMobile)
   const handleChangeLayout = (e, value) => {
     if (value !== null) {
       setViewLayoyt(value)

diff --git a/frontend/src/contexts/PredictionContext.js b/frontend/src/contexts/PredictionContext.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types'
 import dayjs from "dayjs"
 import utc from 'dayjs/plugin/utc';
 import timezone from 'dayjs/plugin/timezone';
+import useBreakpoint from '../hooks/useBreakpoint';
 dayjs.extend(utc);
 dayjs.extend(timezone);
 export const PredictionEventsContext = createContext({})
@@ -36,15 +37,19 @@ export function PredictionEventsProvider({ children }) {
 
     const [queryOptions, setQueryOptions] = useState(setInitialFilter())
 
+    const currentBreakpoint = useBreakpoint()
+    const isMobile = ['xs', 'sm', 'md'].indexOf(currentBreakpoint.getBreakPointName()) !== -1 ? true : false
+    // console.log("isMobile: %o", isMobile)
+
     // list ou grid
-    const [viewLayoyt, setViewLayoyt] = useState("list")
+    const [viewLayoyt, setViewLayoyt] = useState(isMobile ? "grid" : "list")
 
     function clearFilter() {
         setQueryOptions(setInitialFilter())
     }
 
     return <PredictionEventsContext.Provider value={{
-        queryOptions, setQueryOptions, clearFilter, viewLayoyt, setViewLayoyt
+        queryOptions, setQueryOptions, clearFilter, viewLayoyt, setViewLayoyt, isMobile
     }}>{children}</PredictionEventsContext.Provider>
 }