@stoker-platform/web-app 0.5.117 → 0.5.118

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @stoker-platform/web-app
2
2
 
3
+ ## 0.5.118
4
+
5
+ ### Patch Changes
6
+
7
+ - fix: delay navigation when closing sidebar
8
+
3
9
  ## 0.5.117
4
10
 
5
11
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoker-platform/web-app",
3
- "version": "0.5.117",
3
+ "version": "0.5.118",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "scripts": {
package/src/Tenant.tsx CHANGED
@@ -60,6 +60,8 @@ import { getFunctions, httpsCallable } from "firebase/functions"
60
60
  import { getApp } from "firebase/app"
61
61
  import { useTheme } from "./components/theme-provider"
62
62
 
63
+ const MOBILE_SHEET_CLOSE_MS = 320
64
+
63
65
  function Tenant() {
64
66
  const [dialogContent, setDialogContent] = useDialog()
65
67
  const location = useLocation()
@@ -293,6 +295,16 @@ function Tenant() {
293
295
  [location.pathname, schema.collections],
294
296
  )
295
297
 
298
+ const navigateFromSidebar = useCallback(
299
+ (path: string) => {
300
+ setSidebarOpen(false)
301
+ window.setTimeout(() => {
302
+ runViewTransition(() => navigate(path))
303
+ }, MOBILE_SHEET_CLOSE_MS)
304
+ },
305
+ [navigate],
306
+ )
307
+
296
308
  const [mfaDialog, setMfaDialog] = useState<null | {
297
309
  secret: string
298
310
  totpUri: string
@@ -661,7 +673,7 @@ function Tenant() {
661
673
  ? "flex items-center gap-4 px-2.5 text-foreground"
662
674
  : "flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground"
663
675
  }
664
- onClick={() => runViewTransition(() => navigate("/"))}
676
+ onClick={() => navigateFromSidebar("/")}
665
677
  >
666
678
  <ChartBar className="h-5 w-5" />
667
679
  Dashboard
@@ -678,12 +690,9 @@ function Tenant() {
678
690
  ? cn(className, "text-foreground")
679
691
  : cn(className, "text-muted-foreground hover:text-foreground")
680
692
  }
681
- onClick={() => {
682
- setSidebarOpen(false)
683
- runViewTransition(() =>
684
- navigate(`/${group.collections[0].toLowerCase()}`),
685
- )
686
- }}
693
+ onClick={() =>
694
+ navigateFromSidebar(`/${group.collections[0].toLowerCase()}`)
695
+ }
687
696
  >
688
697
  {/* eslint-disable security/detect-object-injection */}
689
698
  {iconNames[group.collections[0]]
@@ -709,12 +718,7 @@ function Tenant() {
709
718
  "text-muted-foreground hover:text-foreground",
710
719
  )
711
720
  }
712
- onClick={() => {
713
- setSidebarOpen(false)
714
- runViewTransition(() =>
715
- navigate(`/${collection.toLowerCase()}`),
716
- )
717
- }}
721
+ onClick={() => navigateFromSidebar(`/${collection.toLowerCase()}`)}
718
722
  >
719
723
  {/* eslint-disable security/detect-object-injection */}
720
724
  {iconNames[collection]