datastake-daf 0.6.181 → 0.6.182

package/dist/components/index.js

@@ -12448,26 +12448,27 @@ function Loading(_ref) {
 const {
   Paragraph: Paragraph$1
 } = antd.Typography;
-const useHeader = ({
-  title = '',
-  tooltip = '',
-  supportText = '',
-  tags = [],
-  actionButtons: _actionButtons = [],
-  titleTooltip,
-  className,
-  addedHeader = null,
-  addedHeaderFirst,
-  extraButtons: _extraButtons = [],
-  onDownload,
-  downloadDisabled,
-  goBackTo,
-  loading,
-  renderExtraComponents,
-  app = '',
-  isViewMode = false,
-  filtersConfig = {}
-}) => {
+const useHeader = _ref => {
+  let {
+    title = '',
+    tooltip = '',
+    supportText = '',
+    tags = [],
+    actionButtons: _actionButtons = [],
+    titleTooltip,
+    className,
+    addedHeader = null,
+    addedHeaderFirst,
+    extraButtons: _extraButtons = [],
+    onDownload,
+    downloadDisabled,
+    goBackTo,
+    loading,
+    renderExtraComponents,
+    app = '',
+    isViewMode = false,
+    filtersConfig = {}
+  } = _ref;
   const [showFilters, setShowFilters] = React.useState(false);
   const hasFilters = filtersConfig && Object.keys(filtersConfig).length > 0;
   const downloadButtonAction = app && app === 'sbg' && isViewMode ? null : {
@@ -12504,9 +12505,9 @@ const useHeader = ({
   const buttonCont = React.useRef();
   const [mainContWidth, setMainContWidth] = React.useState(600);
   const [buttonContWidth, setButtonContWidth] = React.useState(0);
-  const hasSupportText = !!supportText?.length;
-  const hasTags = !!tags?.length;
-  const hasButtons = !!(actionButtons?.length || extraButtons?.length);
+  const hasSupportText = !!(supportText !== null && supportText !== void 0 && supportText.length);
+  const hasTags = !!(tags !== null && tags !== void 0 && tags.length);
+  const hasButtons = !!(actionButtons !== null && actionButtons !== void 0 && actionButtons.length || extraButtons !== null && extraButtons !== void 0 && extraButtons.length);
   React.useEffect(() => {
     const mainContObserver = new ResizeObserver(entries => {
       const _mainEntry = entries[0];
@@ -18679,6 +18680,7 @@ const Style$A = dt.div`
   width: 100%;
   height: 472px;
   min-height: 300px;
+  flex: 1;
   
   @media (max-width: 768px) {
     height: 350px;
@@ -18689,6 +18691,13 @@ const Style$A = dt.div`
     height: 300px;
     min-height: 200px;
   }
+  
+  /* Responsive height adjustments for sidebar state changes */
+  @media (min-width: 769px) {
+    height: calc(100vh - 200px);
+    min-height: 400px;
+    max-height: 600px;
+  }
 
   .filter-cont {
     position: absolute; 
@@ -18779,6 +18788,9 @@ const Style$A = dt.div`
     flex: 1;
     background: rgb(0, 0, 0);
     z-index: 1;
+    width: 100%;
+    height: 100%;
+    min-height: inherit;
     
     /* Mapbox GL JS specific styles */
     .mapboxgl-ctrl-top-right {
@@ -19048,6 +19060,23 @@ const Style$A = dt.div`
       right: 300px;
     }
   }
+  
+  /* Responsive adjustments for different sidebar states */
+  &.sidebar-collapsed {
+    height: calc(100vh - 180px);
+    
+    @media (min-width: 769px) {
+      height: calc(100vh - 180px);
+    }
+  }
+  
+  &.sidebar-expanded {
+    height: calc(100vh - 200px);
+    
+    @media (min-width: 769px) {
+      height: calc(100vh - 200px);
+    }
+  }
 
   .sider {
     display: flex;
@@ -19976,6 +20005,22 @@ const useGlobe = ({
   };
 };
 
+typeof localStorage.getItem('is_collapsed') === 'string' ? localStorage.getItem('is_collapsed') === 'true' ? true : false : true;
+typeof localStorage.getItem('is_nested_sidebar_collapsed') === 'string' ? localStorage.getItem('is_nested_sidebar_collapsed') === 'true' : true;
+const ResizeContext = /*#__PURE__*/React.createContext({
+  resizeLoading: false,
+  windowWidth: 0,
+  resizeDif: 0,
+  isCollapsed: false,
+  setIsCollapsed: () => {},
+  isNestedSidebarCollapsed: false,
+  setIsNestedSidebarCollapsed: () => {}
+});
+const useResizeContext = () => {
+  const values = React.useContext(ResizeContext);
+  return values;
+};
+
 function Globe(_ref) {
   var _activeMarker$data, _activeMarker$data2;
   let {
@@ -20016,6 +20061,11 @@ function Globe(_ref) {
     });
   }), [data]);
 
+  // Get resize context for sidebar state
+  const {
+    isCollapsed
+  } = useResizeContext();
+
   // Use custom hook to configure globe functionality
   const {
     container,
@@ -20059,9 +20109,20 @@ function Globe(_ref) {
       return () => clearTimeout(timer);
     }
   }, [forceResize]);
+
+  // Force resize when sidebar state changes
+  React.useEffect(() => {
+    if (forceResize) {
+      // Trigger resize when sidebar collapses/expands
+      const timer = setTimeout(() => {
+        forceResize();
+      }, 100);
+      return () => clearTimeout(timer);
+    }
+  }, [isCollapsed, forceResize]);
   return /*#__PURE__*/jsxRuntime.jsx(ComponentWithFocus, {
     children: /*#__PURE__*/jsxRuntime.jsxs(Style$A, {
-      className: formatClassname([showSider && activeMarker && "with-sider"]),
+      className: formatClassname([showSider && activeMarker && "with-sider", isCollapsed ? "sidebar-collapsed" : "sidebar-expanded"]),
       children: [filtersConfig ? /*#__PURE__*/jsxRuntime.jsx(Filters, {
         t: t,
         filtersConfig: filtersConfig,
@@ -51457,22 +51518,6 @@ function useConfig(data) {
   return config;
 }
 
-typeof localStorage.getItem('is_collapsed') === 'string' ? localStorage.getItem('is_collapsed') === 'true' ? true : false : true;
-typeof localStorage.getItem('is_nested_sidebar_collapsed') === 'string' ? localStorage.getItem('is_nested_sidebar_collapsed') === 'true' : true;
-const ResizeContext = /*#__PURE__*/React.createContext({
-  resizeLoading: false,
-  windowWidth: 0,
-  resizeDif: 0,
-  isCollapsed: false,
-  setIsCollapsed: () => {},
-  isNestedSidebarCollapsed: false,
-  setIsNestedSidebarCollapsed: () => {}
-});
-const useResizeContext = () => {
-  const values = React.useContext(ResizeContext);
-  return values;
-};
-
 const DAYS = ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"];
 function UserActivity({
   loading,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.181",
+	"version": "0.6.182",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/Dashboard/Globe/index.jsx

@@ -8,6 +8,7 @@ import CustomIcon from "../../Icon/CustomIcon.jsx";
 import ComponentWithFocus from "../ComponentWithFocus/index.jsx";
 import { formatClassname } from "../../../../../helpers/ClassesHelper";
 import Filters from "../../Filters/FloatingFilters/index.js";
+import { useResizeContext } from "../../../context/Resize/index.js";
 
 /**
  * Globe Component
@@ -129,6 +130,9 @@ function Globe({
 		[data],
 	);
 
+	// Get resize context for sidebar state
+	const { isCollapsed } = useResizeContext();
+
 	// Use custom hook to configure globe functionality
 	const { container, activeMarker, mapOptionsButtonsConfig, forceResize } = useGlobe({
 		data: mappedData,
@@ -171,9 +175,24 @@ function Globe({
 		}
 	}, [forceResize]);
 
+	// Force resize when sidebar state changes
+	useEffect(() => {
+		if (forceResize) {
+			// Trigger resize when sidebar collapses/expands
+			const timer = setTimeout(() => {
+				forceResize();
+			}, 100);
+
+			return () => clearTimeout(timer);
+		}
+	}, [isCollapsed, forceResize]);
+
 	return (
 		<ComponentWithFocus>
-			<Style className={formatClassname([showSider && activeMarker && "with-sider"])}>
+			<Style className={formatClassname([
+				showSider && activeMarker && "with-sider",
+				isCollapsed ? "sidebar-collapsed" : "sidebar-expanded"
+			])}>
 				{filtersConfig ? (
 					<Filters t={t} filtersConfig={filtersConfig} onFilterChange={onFilterChange} />
 				) : null}

package/src/@daf/core/components/Dashboard/Globe/style.js

@@ -7,6 +7,7 @@ const Style = styled.div`
   width: 100%;
   height: 472px;
   min-height: 300px;
+  flex: 1;
   
   @media (max-width: 768px) {
     height: 350px;
@@ -17,6 +18,13 @@ const Style = styled.div`
     height: 300px;
     min-height: 200px;
   }
+  
+  /* Responsive height adjustments for sidebar state changes */
+  @media (min-width: 769px) {
+    height: calc(100vh - 200px);
+    min-height: 400px;
+    max-height: 600px;
+  }
 
   .filter-cont {
     position: absolute; 
@@ -107,6 +115,9 @@ const Style = styled.div`
     flex: 1;
     background: rgb(0, 0, 0);
     z-index: 1;
+    width: 100%;
+    height: 100%;
+    min-height: inherit;
     
     /* Mapbox GL JS specific styles */
     .mapboxgl-ctrl-top-right {
@@ -376,6 +387,23 @@ const Style = styled.div`
       right: 300px;
     }
   }
+  
+  /* Responsive adjustments for different sidebar states */
+  &.sidebar-collapsed {
+    height: calc(100vh - 180px);
+    
+    @media (min-width: 769px) {
+      height: calc(100vh - 180px);
+    }
+  }
+  
+  &.sidebar-expanded {
+    height: calc(100vh - 200px);
+    
+    @media (min-width: 769px) {
+      height: calc(100vh - 200px);
+    }
+  }
 
   .sider {
     display: flex;

package/.env

@@ -1,8 +0,0 @@
-REACT_APP_API_KEY=
-REACT_APP_AUTH_DOMAIN=
-REACT_APP_PROJECT_ID=
-REACT_APP_STORAGE_BUCKED=
-REACT_APP_SENDER_ID=
-REACT_APP_APP_ID=
-REACT_APP_MEASUREMENT_ID=
-REACT_APP_VAPID_KEY=

package/.vscode/settings.json

@@ -1,13 +0,0 @@
-{
-	"cSpell.words": ["cukura"],
-	"files.autoSave": "afterDelay",
-	"editor.wordWrap": "on",
-	"editor.autoClosingBrackets": "always",
-	"editor.autoClosingComments": "always",
-	"editor.autoClosingQuotes": "always",
-	"editor.defaultFormatter": "esbenp.prettier-vscode",
-	"editor.formatOnPaste": true,
-	"editor.formatOnSave": true,
-	"notebook.defaultFormatter": "esbenp.prettier-vscode",
-	"javascript.format.semicolons": "insert"
-}