diff --git a/src/components/ScrollToTop.tsx b/src/components/ScrollToTop.tsx
index 93ee406e1..2c3d7937e 100644
--- a/src/components/ScrollToTop.tsx
+++ b/src/components/ScrollToTop.tsx
@@ -14,7 +14,24 @@ import { useLocation } from 'react-router';
export function ScrollToTop(props: any) {
const location = useLocation();
+ const pathSegments = location.pathname.split('/');
+ const id = pathSegments?.[2] || '';
+
+ const isClientShowPage =
+ id &&
+ location.pathname.startsWith(`/clients/${id}`) &&
+ !location.pathname.endsWith('/edit');
+
+ const isVendorShowPage =
+ id &&
+ location.pathname.startsWith(`/vendors/${id}`) &&
+ !location.pathname.endsWith('/edit');
+
useEffect(() => {
+ if (isClientShowPage || isVendorShowPage) {
+ return;
+ }
+
window.scrollTo(0, 0);
}, [location]);
diff --git a/src/components/TabLoader.tsx b/src/components/TabLoader.tsx
new file mode 100644
index 000000000..5a55adefc
--- /dev/null
+++ b/src/components/TabLoader.tsx
@@ -0,0 +1,19 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2022. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+import { Spinner } from '$app/components/Spinner';
+
+export function TabLoader() {
+ return (
+
+
+
+ );
+}
diff --git a/src/pages/clients/routes.tsx b/src/pages/clients/routes.tsx
index 7f8cf4a73..728e911a7 100644
--- a/src/pages/clients/routes.tsx
+++ b/src/pages/clients/routes.tsx
@@ -13,7 +13,8 @@ import { assigned } from '$app/common/guards/guards/assigned';
import { or } from '$app/common/guards/guards/or';
import { permission } from '$app/common/guards/guards/permission';
import { Route } from 'react-router-dom';
-import { lazy } from 'react';
+import { lazy, Suspense } from 'react';
+import { TabLoader } from '$app/components/TabLoader';
const Clients = lazy(() => import('$app/pages/clients/index/Clients'));
const Import = lazy(() => import('$app/pages/clients/import/Import'));
@@ -97,17 +98,94 @@ export const clientRoutes = (
/>
}
>
- } />
- } />
- } />
- } />
- } />
- } />
- } />
- } />
- } />
- } />
- } />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
import('$app/pages/vendors/index/Vendors'));
const Import = lazy(() => import('$app/pages/vendors/import/Import'));
@@ -80,12 +81,54 @@ export const vendorRoutes = (
/>
}
>
- } />
- } />
- } />
- } />
- } />
- } />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />
+ }>
+
+
+ }
+ />