Update package-lock.json

.github/workflows/build_and_push.yml

@@ -28,33 +28,6 @@ jobs:
 
       - run: echo '{}' > .local-config.json
 
-      - name: Download IronRDP release TS files
-        uses: robinraju/release-downloader@v1.7
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          repository: netbirdio/IronRDP
-          latest: true
-          fileName: "*.ts"
-          out-file-path: 'public/ironrdp-pkg'
-
-      - name: Download IronRDP release JS files
-        uses: robinraju/release-downloader@v1.7
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          repository: netbirdio/IronRDP
-          latest: true
-          fileName: "*.js"
-          out-file-path: 'public/ironrdp-pkg'
-
-      - name: Download IronRDP release WASM file
-        uses: robinraju/release-downloader@v1.7
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          repository: netbirdio/IronRDP
-          latest: true
-          fileName: "ironrdp_web_bg.wasm"
-          out-file-path: 'public/ironrdp-pkg'
-
       - name: Build
         run: npm run build
       -
@@ -71,6 +44,7 @@ jobs:
           images: ${{ env.IMAGE_NAME }}
       -
         name: Login to DockerHub
+        if: github.event_name != 'pull_request'
         uses: docker/login-action@v2
         with:
           username: ${{ secrets.NB_DOCKER_USER }}
@@ -81,7 +55,7 @@ jobs:
         with:
           context: .
           file: docker/Dockerfile
-          push: true
+          push: ${{ github.event_name != 'pull_request' }}
           platforms: linux/amd64,linux/arm64,linux/arm
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}

.gitignore

@@ -41,8 +41,3 @@ next-env.d.ts
 .configs/.staging-config.json
 .configs/.temp-config.json
 .configs
-
-/public/ironrdp-pkg/
-/public/netbird.wasm
-.idea
-src/.local-config*

README.md

@@ -26,7 +26,6 @@ The dashboard makes it possible to:
 - NextJS
 - ReactJS
 - Tailwind CSS
-- [React Flow](https://reactflow.dev/) for the Control Center
 - Auth0
 - Nginx
 - Docker

config.json

@@ -12,7 +12,5 @@
   "tokenSource": "$NETBIRD_TOKEN_SOURCE",
   "dragQueryParams": "$NETBIRD_DRAG_QUERY_PARAMS",
   "hotjarTrackID": "$NETBIRD_HOTJAR_TRACK_ID",
-  "googleAnalyticsID": "$NETBIRD_GOOGLE_ANALYTICS_ID",
-  "googleTagManagerID": "$NETBIRD_GOOGLE_TAG_MANAGER_ID",
-  "wasmPath": "$NETBIRD_WASM_PATH"
+  "googleAnalyticsID": "$NETBIRD_GOOGLE_ANALYTICS_ID"
 }

docker/default.conf

@@ -3,14 +3,6 @@ server {
 	listen [::]:80 default_server;
 
     root /usr/share/nginx/html;
-    location = /netbird.wasm {
-        root /usr/share/nginx/html;
-        default_type application/wasm;
-    }
-    location = /ironrdp-pkg/ironrdp_web_bg.wasm {
-        root /usr/share/nginx/html;
-        default_type application/wasm;
-    }
 
     location / {
       try_files $uri $uri.html $uri/ =404;

docker/init_react_envs.sh

@@ -58,15 +58,13 @@ export NETBIRD_MGMT_API_ENDPOINT=$(echo $NETBIRD_MGMT_API_ENDPOINT | sed -E 's/(
 export NETBIRD_MGMT_GRPC_API_ENDPOINT=${NETBIRD_MGMT_GRPC_API_ENDPOINT}
 export NETBIRD_HOTJAR_TRACK_ID=${NETBIRD_HOTJAR_TRACK_ID}
 export NETBIRD_GOOGLE_ANALYTICS_ID=${NETBIRD_GOOGLE_ANALYTICS_ID}
-export NETBIRD_GOOGLE_TAG_MANAGER_ID=${NETBIRD_GOOGLE_TAG_MANAGER_ID}
 export NETBIRD_TOKEN_SOURCE=${NETBIRD_TOKEN_SOURCE:-accessToken}
 export NETBIRD_DRAG_QUERY_PARAMS=${NETBIRD_DRAG_QUERY_PARAMS:-false}
-export NETBIRD_WASM_PATH=${NETBIRD_WASM_PATH}
 
 echo "NetBird latest version: ${NETBIRD_LATEST_VERSION}"
 
 # replace ENVs in the config
-ENV_STR="\$\$USE_AUTH0 \$\$AUTH_AUDIENCE \$\$AUTH_AUTHORITY \$\$AUTH_CLIENT_ID \$\$AUTH_CLIENT_SECRET \$\$AUTH_SUPPORTED_SCOPES \$\$NETBIRD_MGMT_API_ENDPOINT \$\$NETBIRD_MGMT_GRPC_API_ENDPOINT \$\$NETBIRD_HOTJAR_TRACK_ID \$\$NETBIRD_GOOGLE_ANALYTICS_ID \$\$NETBIRD_GOOGLE_TAG_MANAGER_ID \$\$AUTH_REDIRECT_URI \$\$AUTH_SILENT_REDIRECT_URI \$\$NETBIRD_TOKEN_SOURCE \$\$NETBIRD_DRAG_QUERY_PARAMS \$\$NETBIRD_WASM_PATH"
+ENV_STR="\$\$USE_AUTH0 \$\$AUTH_AUDIENCE \$\$AUTH_AUTHORITY \$\$AUTH_CLIENT_ID \$\$AUTH_CLIENT_SECRET \$\$AUTH_SUPPORTED_SCOPES \$\$NETBIRD_MGMT_API_ENDPOINT \$\$NETBIRD_MGMT_GRPC_API_ENDPOINT \$\$NETBIRD_HOTJAR_TRACK_ID \$\$NETBIRD_GOOGLE_ANALYTICS_ID \$\$AUTH_REDIRECT_URI \$\$AUTH_SILENT_REDIRECT_URI \$\$NETBIRD_TOKEN_SOURCE \$\$NETBIRD_DRAG_QUERY_PARAMS"
 
 OIDC_TRUSTED_DOMAINS="/usr/share/nginx/html/OidcTrustedDomains.js"
 envsubst "$ENV_STR" < "$OIDC_TRUSTED_DOMAINS".tmpl > "$OIDC_TRUSTED_DOMAINS"

docker/nginx.conf

@@ -101,7 +101,6 @@ http {
     application/rss+xml
     application/vnd.geo+json
     application/vnd.ms-fontobject
-    application/wasm
     application/x-font-ttf
     application/x-web-app-manifest+json
     application/xhtml+xml

package.json

@@ -14,7 +14,6 @@
   },
   "dependencies": {
     "@axa-fr/react-oidc": "^7.22.18",
-    "@dagrejs/dagre": "^1.1.5",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-checkbox": "^1.0.4",
     "@radix-ui/react-collapsible": "^1.0.3",
@@ -36,26 +35,18 @@
     "@tanstack/match-sorter-utils": "^8.8.4",
     "@tanstack/react-table": "^8.10.7",
     "@types/crypto-js": "^4.2.2",
-    "@types/d3": "^7.4.3",
     "@types/lodash": "^4.14.200",
     "@types/node": "20.10.6",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/react-window": "^1.8.8",
-    "@xterm/addon-fit": "^0.10.0",
-    "@xterm/xterm": "^5.5.0",
-    "@xyflow/react": "^12.8.4",
     "autoprefixer": "^10",
-    "chart.js": "^4.4.8",
-    "chroma-js": "^3.1.2",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "cmdk": "^0.2.0",
     "crypto-js": "^4.2.0",
-    "d3": "^7.9.0",
     "date-fns": "^2.30.0",
     "dayjs": "^1.11.10",
-    "elkjs": "^0.10.0",
     "eslint": "^8",
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-simple-import-sort": "^10.0.0",
@@ -63,9 +54,8 @@
     "flowbite-react": "^0.6.4",
     "framer-motion": "^10.16.4",
     "ip-cidr": "^3.1.0",
-    "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
-    "lucide-react": "^0.539.0",
+    "lucide-react": "^0.460.0",
     "next": "^14.2.28",
     "next-themes": "^0.2.1",
     "punycode": "^2.3.1",
@@ -83,15 +73,11 @@
     "swr": "^2.2.4",
     "tailwind-merge": "^1.14.0",
     "tailwindcss-animate": "^1.0.7",
-    "timescape": "^0.7.1",
     "typescript": "^5"
   },
   "devDependencies": {
-    "@faker-js/faker": "^9.5.1",
-    "@types/chroma-js": "^3.1.1",
-    "@types/js-cookie": "^3.0.6",
-    "eslint-config-next": "^14.2.28",
     "cypress": "^13.13.0",
+    "eslint-config-next": "^14.2.28",
     "postcss": "^8",
     "prettier": "3.0.3",
     "tailwindcss": "^3"

src/app/(dashboard)/(deprecated)/activity/page.tsx

@@ -1,10 +0,0 @@
-"use client";
-
-import FullScreenLoading from "@components/ui/FullScreenLoading";
-import { useRedirect } from "@hooks/useRedirect";
-import React from "react";
-
-export default function Redirect() {
-  useRedirect("/events/audit");
-  return <FullScreenLoading height={"auto"} />;
-}

src/app/(dashboard)/access-control/page.tsx

@@ -11,7 +11,6 @@ import { ExternalLinkIcon } from "lucide-react";
 import React, { lazy, Suspense } from "react";
 import AccessControlIcon from "@/assets/icons/AccessControlIcon";
 import GroupsProvider from "@/contexts/GroupsProvider";
-import { usePermissions } from "@/contexts/PermissionsProvider";
 import PoliciesProvider from "@/contexts/PoliciesProvider";
 import { Policy } from "@/interfaces/Policy";
 import PageContainer from "@/layouts/PageContainer";
@@ -20,8 +19,6 @@ const AccessControlTable = lazy(
   () => import("@/modules/access-control/table/AccessControlTable"),
 );
 export default function AccessControlPage() {
-  const { permission } = usePermissions();
-
   const { data: policies, isLoading } = useFetchApi<Policy[]>("/policies");
 
   const { ref: headingRef, portalTarget } =
@@ -33,7 +30,7 @@ export default function AccessControlPage() {
         <div className={"p-default py-6"}>
           <Breadcrumbs>
             <Breadcrumbs.Item
-              href={"/access-control"}
+              href={"/policies"}
               label={"Access Control"}
               icon={<AccessControlIcon size={14} />}
             />
@@ -56,10 +53,7 @@ export default function AccessControlPage() {
           </Paragraph>
         </div>
 
-        <RestrictedAccess
-          page={"Access Control"}
-          hasAccess={permission.policies.read}
-        >
+        <RestrictedAccess page={"Access Control"}>
           <PoliciesProvider>
             <Suspense fallback={<SkeletonTable />}>
               <AccessControlTable

src/app/(dashboard)/activity/page.tsx

@@ -6,19 +6,15 @@ import Paragraph from "@components/Paragraph";
 import { RestrictedAccess } from "@components/ui/RestrictedAccess";
 import { usePortalElement } from "@hooks/usePortalElement";
 import useFetchApi from "@utils/api";
-import { ExternalLinkIcon, LogsIcon } from "lucide-react";
+import { ExternalLinkIcon } from "lucide-react";
 import React from "react";
 import ActivityIcon from "@/assets/icons/ActivityIcon";
-import { usePermissions } from "@/contexts/PermissionsProvider";
 import { ActivityEvent } from "@/interfaces/ActivityEvent";
 import PageContainer from "@/layouts/PageContainer";
 import ActivityTable from "@/modules/activity/ActivityTable";
 
 export default function Activity() {
-  const { permission } = usePermissions();
-
-  const { data: events, isLoading } =
-    useFetchApi<ActivityEvent[]>("/events/audit");
+  const { data: events, isLoading } = useFetchApi<ActivityEvent[]>("/events");
 
   const { ref: headingRef, portalTarget } =
     usePortalElement<HTMLHeadingElement>();
@@ -28,31 +24,30 @@ export default function Activity() {
       <div className={"p-default py-6"}>
         <Breadcrumbs>
           <Breadcrumbs.Item
+            href={"/activity"}
             label={"Activity"}
-            disabled={true}
             icon={<ActivityIcon size={13} />}
           />
-          <Breadcrumbs.Item
-            href={"/events/audit"}
-            label={"Audit Events"}
-            icon={<LogsIcon size={18} />}
-          />
         </Breadcrumbs>
-        <h1 ref={headingRef}>Audit Events</h1>
-        <Paragraph>Here you can see all the audit activity events.</Paragraph>
+        <h1 ref={headingRef}>Activity Events</h1>
+        <Paragraph>
+          Here you can see all the account and network activity events.
+        </Paragraph>
         <Paragraph>
           Learn more about{" "}
           <InlineLink
-            href={"https://docs.netbird.io/how-to/audit-events-logging"}
+            href={
+              "https://docs.netbird.io/how-to/monitor-system-and-network-activity"
+            }
             target={"_blank"}
           >
-            Audit Events
+            Activity Events
             <ExternalLinkIcon size={12} />
           </InlineLink>
           in our documentation.
         </Paragraph>
       </div>
-      <RestrictedAccess page={"Activity"} hasAccess={permission.events.read}>
+      <RestrictedAccess page={"Activity"}>
         <ActivityTable
           events={events}
           isLoading={isLoading}

src/app/(dashboard)/control-center/layout.tsx

@@ -1,8 +0,0 @@
-import { globalMetaTitle } from "@utils/meta";
-import type { Metadata } from "next";
-import BlankLayout from "@/layouts/BlankLayout";
-
-export const metadata: Metadata = {
-  title: `Control Center - ${globalMetaTitle}`,
-};
-export default BlankLayout;

src/app/(dashboard)/dns/nameservers/page.tsx

@@ -10,7 +10,6 @@ import useFetchApi from "@utils/api";
 import { ExternalLinkIcon, ServerIcon } from "lucide-react";
 import React, { lazy, Suspense } from "react";
 import DNSIcon from "@/assets/icons/DNSIcon";
-import { usePermissions } from "@/contexts/PermissionsProvider";
 import { NameserverGroup } from "@/interfaces/Nameserver";
 import PageContainer from "@/layouts/PageContainer";
 
@@ -19,8 +18,6 @@ const NameserverGroupTable = lazy(
 );
 
 export default function NameServers() {
-  const { permission } = usePermissions();
-
   const { data: nameserverGroups, isLoading } =
     useFetchApi<NameserverGroup[]>("/dns/nameservers");
 
@@ -32,7 +29,7 @@ export default function NameServers() {
       <div className={"p-default py-6"}>
         <Breadcrumbs>
           <Breadcrumbs.Item
-            href={"/dns/nameservers"}
+            href={"/dns"}
             label={"DNS"}
             icon={<DNSIcon size={13} />}
           />
@@ -60,10 +57,7 @@ export default function NameServers() {
         </Paragraph>
       </div>
 
-      <RestrictedAccess
-        page={"Nameservers"}
-        hasAccess={permission.nameservers.read}
-      >
+      <RestrictedAccess page={"Nameservers"}>
         <Suspense fallback={<SkeletonTable />}>
           <NameserverGroupTable
             nameserverGroups={nameserverGroups}

src/app/(dashboard)/dns/settings/page.tsx

@@ -17,7 +17,6 @@ import React from "react";
 import Skeleton from "react-loading-skeleton";
 import { useSWRConfig } from "swr";
 import DNSIcon from "@/assets/icons/DNSIcon";
-import { usePermissions } from "@/contexts/PermissionsProvider";
 import { useHasChanges } from "@/hooks/useHasChanges";
 import { Group } from "@/interfaces/Group";
 import { NameserverSettings } from "@/interfaces/NameserverSettings";
@@ -26,8 +25,6 @@ import useGroupHelper from "@/modules/groups/useGroupHelper";
 import { useGroupIdsToGroups } from "@/modules/groups/useGroupIdsToGroups";
 
 export default function NameServerSettings() {
-  const { permission } = usePermissions();
-
   const { data: settings, isLoading } =
     useFetchApi<NameserverSettings>("/dns/settings");
 
@@ -64,7 +61,7 @@ export default function NameServerSettings() {
           </InlineLink>
           in our documentation.
         </Paragraph>
-        <RestrictedAccess page={"DNS Settings"} hasAccess={permission.dns.read}>
+        <RestrictedAccess page={"DNS Settings"}>
           {!isLoading && initialDNSGroups !== undefined ? (
             <SettingDisabledManagementGroups initialGroups={initialDNSGroups} />
           ) : (
@@ -89,7 +86,6 @@ const SettingDisabledManagementGroups = ({
 }) => {
   const settingRequest = useApiCall<NameserverSettings>("/dns/settings");
   const { mutate } = useSWRConfig();
-  const { permission } = usePermissions();
 
   const [selectedGroups, setSelectedGroups, { save: saveGroups }] =
     useGroupHelper({
@@ -128,7 +124,6 @@ const SettingDisabledManagementGroups = ({
           dataCy={"dns-groups-selector"}
           onChange={setSelectedGroups}
           values={selectedGroups}
-          disabled={!permission.dns.update}
         />
       </div>
       <div
@@ -140,7 +135,7 @@ const SettingDisabledManagementGroups = ({
           variant={"primary"}
           size={"sm"}
           onClick={saveSettings}
-          disabled={!hasChanges || !permission.dns.update}
+          disabled={!hasChanges}
           data-cy={"save-changes"}
         >
           Save Changes

src/app/(dashboard)/events/audit/layout.tsx

@@ -1,8 +0,0 @@
-import { globalMetaTitle } from "@utils/meta";
-import type { Metadata } from "next";
-import BlankLayout from "@/layouts/BlankLayout";
-
-export const metadata: Metadata = {
-  title: `Audit Events - Activity - ${globalMetaTitle}`,
-};
-export default BlankLayout;