utopia-ui 3.0.0-alpha.174 → 3.0.0-alpha.175

package/dist/index.js

@@ -1128,13 +1128,34 @@ var DateUserInfo = function (_a) {
                     jsx("p", __assign({ className: "!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500", onClick: function () { return setInfoExpanded(true); } }, { children: "\u24D8" })), jsx("div", { className: 'tw-grow ' })] })));
 };
 
+function getWindowDimensions() {
+    var width = window.innerWidth, height = window.innerHeight;
+    return {
+        width: width,
+        height: height
+    };
+}
+function useWindowDimensions() {
+    var _a = useState(getWindowDimensions()), windowDimensions = _a[0], setWindowDimensions = _a[1];
+    useEffect(function () {
+        function handleResize() {
+            setWindowDimensions(getWindowDimensions());
+        }
+        window.addEventListener('resize', handleResize);
+        return function () { return window.removeEventListener('resize', handleResize); };
+    }, []);
+    return windowDimensions;
+}
+
 var ItemCard = function (_a) {
     var _b, _c, _d, _e, _f, _g, _h;
     var i = _a.i, loading = _a.loading, url = _a.url, parameterField = _a.parameterField, deleteCallback = _a.deleteCallback;
     var navigate = useNavigate();
+    var windowDimensions = useWindowDimensions();
     return (jsxs("div", __assign({ className: 'tw-cursor-pointer tw-card tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-bg-base-100 tw-text-base-content tw-p-4 tw-mb-4 tw-h-fit', onClick: function () {
             var params = new URLSearchParams(window.location.search);
-            navigate(url + getValue(i, parameterField) + "".concat(params ? "?".concat(params) : ""));
+            windowDimensions.width >= 786 && navigate(url + getValue(i, parameterField) + "".concat(params ? "?".concat(params) : ""));
+            windowDimensions.width < 786 && navigate("/" + getValue(i, parameterField) + "".concat(params ? "?".concat(params) : ""));
         } }, { children: [jsx(HeaderView, { loading: loading, item: i, api: (_b = i.layer) === null || _b === void 0 ? void 0 : _b.api, itemAvatarField: (_c = i.layer) === null || _c === void 0 ? void 0 : _c.itemAvatarField, itemNameField: (_d = i.layer) === null || _d === void 0 ? void 0 : _d.itemNameField, itemSubnameField: (_e = i.layer) === null || _e === void 0 ? void 0 : _e.itemSubnameField, editCallback: function () { return navigate("/edit-item/" + i.id); }, deleteCallback: function () { return deleteCallback(i); } }), jsxs("div", __assign({ className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade' }, { children: [((_f = i.layer) === null || _f === void 0 ? void 0 : _f.itemType.show_start_end) &&
                         jsx(StartEndView, { item: i }), ((_g = i.layer) === null || _g === void 0 ? void 0 : _g.itemType.show_text) &&
                         jsx(TextView, { truncate: true, item: i, itemTextField: (_h = i.layer) === null || _h === void 0 ? void 0 : _h.itemTextField })] })), jsx(DateUserInfo, { item: i })] })));
@@ -1191,6 +1212,7 @@ function useFilterManager(initialTags) {
     }, initialTags), filterTags = _a[0], dispatchTags = _a[1];
     var initialLayers = useLayers();
     var navigate = useNavigate();
+    var windowDimensions = useWindowDimensions();
     var _b = useReducer(function (state, action) {
         switch (action.type) {
             case "ADD_LAYER":
@@ -1226,7 +1248,10 @@ function useFilterManager(initialTags) {
         var urlTags = params.get("tags");
         if (!(urlTags === null || urlTags === void 0 ? void 0 : urlTags.includes(tag.name)))
             params.set("tags", "".concat(urlTags ? urlTags : "").concat(urlTags ? ',' : '').concat(tag.name));
-        navigate(location.pathname + "".concat(params ? "?".concat(params) : ""));
+        if (windowDimensions.width < 786 && location.pathname.split("/").length > 2)
+            navigate("/" + "".concat(params ? "?".concat(params) : ""));
+        else
+            navigate(location.pathname + "".concat(params ? "?".concat(params) : ""));
         dispatchTags({
             type: "ADD_TAG",
             tag: tag,
@@ -1319,25 +1344,6 @@ var useIsLayerVisible = function () {
     return isLayerVisible;
 };
 
-function getWindowDimensions() {
-    var width = window.innerWidth, height = window.innerHeight;
-    return {
-        width: width,
-        height: height
-    };
-}
-function useWindowDimensions() {
-    var _a = useState(getWindowDimensions()), windowDimensions = _a[0], setWindowDimensions = _a[1];
-    useEffect(function () {
-        function handleResize() {
-            setWindowDimensions(getWindowDimensions());
-        }
-        window.addEventListener('resize', handleResize);
-        return function () { return window.removeEventListener('resize', handleResize); };
-    }, []);
-    return windowDimensions;
-}
-
 var useTimeout = function (callback, delay) {
     var callbackRef = useRef(callback);
     var timeoutRef = useRef();