diff --git a/apps/web-remix/app/components/progressBar/PageProgress.tsx b/apps/web-remix/app/components/progressBar/PageProgress.tsx
new file mode 100644
index 000000000..f75501707
--- /dev/null
+++ b/apps/web-remix/app/components/progressBar/PageProgress.tsx
@@ -0,0 +1,18 @@
+import React, { useEffect } from "react";
+import { useNavigation } from "@remix-run/react";
+import NProgress from "nprogress";
+import "nprogress/nprogress.css";
+import "./pageProgress.css";
+
+NProgress.configure({ showSpinner: false });
+
+export const PageProgress: React.FC = () => {
+ const { state } = useNavigation();
+
+ useEffect(() => {
+ if (state === "loading") NProgress.start();
+ if (state === "idle") NProgress.done();
+ }, [state]);
+
+ return null;
+};
diff --git a/apps/web-remix/app/components/progressBar/pageProgress.css b/apps/web-remix/app/components/progressBar/pageProgress.css
new file mode 100644
index 000000000..d8cdf66f2
--- /dev/null
+++ b/apps/web-remix/app/components/progressBar/pageProgress.css
@@ -0,0 +1,11 @@
+#nprogress .bar{
+ @apply !bg-primary-500 !h-[1.5px]
+}
+
+#nprogress .spinner-icon{
+ @apply !border-t-primary-600 !border-l-primary-600
+}
+
+#nprogress .peg{
+ @apply !shadow-xl !shadow-primary-500
+}
diff --git a/apps/web-remix/app/root.tsx b/apps/web-remix/app/root.tsx
index 95624feeb..c5f1092f3 100644
--- a/apps/web-remix/app/root.tsx
+++ b/apps/web-remix/app/root.tsx
@@ -1,5 +1,6 @@
import { withSentry } from "@sentry/remix";
import type { LinksFunction } from "@remix-run/node";
+import Modal from "react-modal";
import {
isRouteErrorResponse,
Links,
@@ -13,7 +14,7 @@ import { Toaster } from "~/components/toasts/Toaster";
import "./tailwind.css";
import { GlobalNotFound } from "~/components/errorBoundaries/GlobalNotFound";
import { GlobalRuntime } from "~/components/errorBoundaries/GlobalRuntime";
-import Modal from "react-modal";
+import { PageProgress } from "~/components/progressBar/PageProgress";
Modal.setAppElement("#_root");
@@ -50,6 +51,7 @@ function App() {
+
diff --git a/apps/web-remix/app/routes/_dashboard.$organizationId.tsx b/apps/web-remix/app/routes/_dashboard.$organizationId.tsx
index af911c53c..ceffb154a 100644
--- a/apps/web-remix/app/routes/_dashboard.$organizationId.tsx
+++ b/apps/web-remix/app/routes/_dashboard.$organizationId.tsx
@@ -1,5 +1,5 @@
import { Avatar, Button, Icon, IconButton } from "@elpassion/taco";
-import { DataFunctionArgs, json, LoaderFunctionArgs } from "@remix-run/node";
+import { json, LoaderFunctionArgs } from "@remix-run/node";
import {
Link,
Outlet,
diff --git a/apps/web-remix/package.json b/apps/web-remix/package.json
index 5cbf20e99..be73c7ab6 100644
--- a/apps/web-remix/package.json
+++ b/apps/web-remix/package.json
@@ -52,6 +52,7 @@
"lru-cache": "^10.2.0",
"markdown-to-jsx": "^7.4.1",
"morgan": "^1.10.0",
+ "nprogress": "^0.2.0",
"phoenix": "^1.7.7",
"rc-menu": "^9.12.0",
"rc-select": "^14.11.0",
@@ -89,6 +90,7 @@
"@types/lodash.merge": "^4.6.7",
"@types/lodash.startcase": "^4.4.7",
"@types/morgan": "^1.9.5",
+ "@types/nprogress": "^0.2.3",
"@types/phoenix": "^1.6.0",
"@types/react": "^18.0.35",
"@types/react-dom": "^18.0.11",
diff --git a/apps/web-remix/pnpm-lock.yaml b/apps/web-remix/pnpm-lock.yaml
index db729578a..edefd3873 100644
--- a/apps/web-remix/pnpm-lock.yaml
+++ b/apps/web-remix/pnpm-lock.yaml
@@ -119,6 +119,9 @@ dependencies:
morgan:
specifier: ^1.10.0
version: 1.10.0
+ nprogress:
+ specifier: ^0.2.0
+ version: 0.2.0
phoenix:
specifier: ^1.7.7
version: 1.7.11
@@ -226,6 +229,9 @@ devDependencies:
'@types/morgan':
specifier: ^1.9.5
version: 1.9.9
+ '@types/nprogress':
+ specifier: ^0.2.3
+ version: 0.2.3
'@types/phoenix':
specifier: ^1.6.0
version: 1.6.4
@@ -2836,6 +2842,10 @@ packages:
dependencies:
undici-types: 5.26.5
+ /@types/nprogress@0.2.3:
+ resolution: {integrity: sha512-k7kRA033QNtC+gLc4VPlfnue58CM1iQLgn1IMAU8VPHGOj7oIHPp9UlhedEnD/Gl8evoCjwkZjlBORtZ3JByUA==}
+ dev: true
+
/@types/parse-json@4.0.2:
resolution: {integrity: sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==}
dev: false
@@ -7225,6 +7235,10 @@ packages:
path-key: 4.0.0
dev: true
+ /nprogress@0.2.0:
+ resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==}
+ dev: false
+
/nwsapi@2.2.7:
resolution: {integrity: sha512-ub5E4+FBPKwAZx0UwIQOjYWGHTEq5sPqHQNRN8Z9e4A7u3Tj1weLJsL59yH9vmvqEtBHaOmT6cYQKIZOxp35FQ==}
dev: true