chore(root): rename organizationSlug to organizationId (#91)

2024-11-20 14:04:55 +01:00
parent 0221948aab
commit cd16ac878d
52 changed files with 176 additions and 360 deletions
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx
@@ -60,7 +60,7 @@ export function ListReports({ reports, dashboard }: ListReportsProps) {
            icon={PlusIcon}
            onClick={() => {
              router.push(
-                `/${params.organizationSlug}/${
+                `/${params.organizationId}/${
                  params.projectId
                }/reports?${new URLSearchParams({
                  dashboardId: params.dashboardId,
@@ -79,7 +79,7 @@ export function ListReports({ reports, dashboard }: ListReportsProps) {
          return (
            <div className="card" key={report.id}>
              <Link
-                href={`/${params.organizationSlug}/${params.projectId}/reports/${report.id}`}
+                href={`/${params.organizationId}/${params.projectId}/reports/${report.id}`}
                className="flex items-center justify-between border-b border-border p-4 leading-none [&_svg]:hover:opacity-100"
                shallow
              >
@@ -163,7 +163,7 @@ export function ListReports({ reports, dashboard }: ListReportsProps) {
            <Button
              onClick={() =>
                router.push(
-                  `/${params.organizationSlug}/${
+                  `/${params.organizationId}/${
                    params.projectId
                  }/reports?${new URLSearchParams({
                    dashboardId: params.dashboardId,
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/page.tsx
@@ -7,7 +7,6 @@ import { ListReports } from './list-reports';

 interface PageProps {
  params: {
-    organizationSlug: string;
    projectId: string;
    dashboardId: string;
  };
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/list-dashboards/list-dashboards.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/list-dashboards/list-dashboards.tsx
@@ -37,7 +37,7 @@ interface ListDashboardsProps {
 export function ListDashboards({ dashboards }: ListDashboardsProps) {
  const router = useRouter();
  const params = useAppParams();
-  const { organizationSlug, projectId } = params;
+  const { organizationId, projectId } = params;
  const deletion = api.dashboard.delete.useMutation({
    onError: (error, variables) => {
      return handleErrorToastOptions({
@@ -87,7 +87,7 @@ export function ListDashboards({ dashboards }: ListDashboardsProps) {
            <Card key={item.id} hover>
              <div>
                <Link
-                  href={`/${organizationSlug}/${projectId}/dashboards/${item.id}`}
+                  href={`/${organizationId}/${projectId}/dashboards/${item.id}`}
                  className="flex flex-col p-4 @container"
                >
                  <div className="col gap-2">
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/events/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/events/page.tsx
@@ -9,7 +9,6 @@ import Events from './events';
 interface PageProps {
  params: {
    projectId: string;
-    organizationSlug: string;
  };
  searchParams: Record<string, string>;
 }
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-organization-selector.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-organization-selector.tsx
@@ -18,7 +18,7 @@ export default function LayoutOrganizationSelector({
  const router = useRouter();

  const organization = organizations.find(
-    (item) => item.id === params.organizationSlug,
+    (item) => item.id === params.organizationId,
  );

  return (
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-project-selector.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-project-selector.tsx
@@ -14,11 +14,9 @@ import {
 } from '@/components/ui/dropdown-menu';
 import { useAppParams } from '@/hooks/useAppParams';
 import { pushModal } from '@/modals';
-import { cn } from '@/utils/cn';
 import {
  Building2Icon,
  CheckIcon,
-  ChevronsUpDown,
  ChevronsUpDownIcon,
  PlusIcon,
 } from 'lucide-react';
@@ -27,12 +25,12 @@ import { useState } from 'react';

 import type {
  getCurrentOrganizations,
-  getProjectsByOrganizationSlug,
+  getProjectsByOrganizationId,
 } from '@openpanel/db';
 import Link from 'next/link';

 interface LayoutProjectSelectorProps {
-  projects: Awaited<ReturnType<typeof getProjectsByOrganizationSlug>>;
+  projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>;
  organizations?: Awaited<ReturnType<typeof getCurrentOrganizations>>;
  align?: 'start' | 'end';
 }
@@ -42,22 +40,22 @@ export default function LayoutProjectSelector({
  align = 'start',
 }: LayoutProjectSelectorProps) {
  const router = useRouter();
-  const { organizationSlug, projectId } = useAppParams();
+  const { organizationId, projectId } = useAppParams();
  const pathname = usePathname() || '';
  const [open, setOpen] = useState(false);

  const changeProject = (newProjectId: string) => {
-    if (organizationSlug && projectId) {
+    if (organizationId && projectId) {
      const split = pathname
        .replace(
-          `/${organizationSlug}/${projectId}`,
-          `/${organizationSlug}/${newProjectId}`,
+          `/${organizationId}/${projectId}`,
+          `/${organizationId}/${newProjectId}`,
        )
        .split('/');
      // slicing here will remove everything after /{orgId}/{projectId}/dashboards [slice here] /xxx/xxx/xxx
      router.push(split.slice(0, 4).join('/'));
    } else {
-      router.push(`/${organizationSlug}/${newProjectId}`);
+      router.push(`/${organizationId}/${newProjectId}`);
    }
  };

@@ -102,7 +100,7 @@ export default function LayoutProjectSelector({
          ))}
          {projects.length > 10 && (
            <DropdownMenuItem asChild>
-              <Link href={`/${organizationSlug}`}>All projects</Link>
+              <Link href={`/${organizationId}`}>All projects</Link>
            </DropdownMenuItem>
          )}
          <DropdownMenuItem
@@ -126,7 +124,7 @@ export default function LayoutProjectSelector({
                  onClick={() => changeOrganization(organization.id)}
                >
                  {organization.name}
-                  {organization.id === organizationSlug && (
+                  {organization.id === organizationId && (
                    <DropdownMenuShortcut>
                      <CheckIcon size={16} />
                    </DropdownMenuShortcut>
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-sidebar.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout-sidebar.tsx
@@ -11,7 +11,7 @@ import { useEffect, useState } from 'react';
 import type {
  IServiceDashboards,
  IServiceOrganization,
-  getProjectsByOrganizationSlug,
+  getProjectsByOrganizationId,
 } from '@openpanel/db';

 import LayoutMenu from './layout-menu';
@@ -20,9 +20,8 @@ import LayoutProjectSelector from './layout-project-selector';
 interface LayoutSidebarProps {
  organizations: IServiceOrganization[];
  dashboards: IServiceDashboards;
-  organizationSlug: string;
  projectId: string;
-  projects: Awaited<ReturnType<typeof getProjectsByOrganizationSlug>>;
+  projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>;
 }
 export function LayoutSidebar({
  organizations,
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/layout.tsx
@@ -13,22 +13,22 @@ import SideEffects from './side-effects';
 interface AppLayoutProps {
  children: React.ReactNode;
  params: {
-    organizationSlug: string;
+    organizationId: string;
    projectId: string;
  };
 }

 export default async function AppLayout({
  children,
-  params: { organizationSlug, projectId },
+  params: { organizationId, projectId },
 }: AppLayoutProps) {
  const [organizations, projects, dashboards] = await Promise.all([
    getCurrentOrganizations(),
-    getCurrentProjects(organizationSlug),
+    getCurrentProjects(organizationId),
    getDashboardsByProjectId(projectId),
  ]);

-  if (!organizations.find((item) => item.id === organizationSlug)) {
+  if (!organizations.find((item) => item.id === organizationId)) {
    return (
      <FullPageEmptyState title="Not found" className="min-h-screen">
        The organization you were looking for could not be found.
@@ -48,7 +48,7 @@ export default async function AppLayout({
    <div id="dashboard">
      <LayoutSidebar
        {...{
-          organizationSlug,
+          organizationId,
          projectId,
          organizations,
          projects,
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/page.tsx
@@ -13,7 +13,6 @@ import { OverviewReportRange } from './overview-sticky-header';

 interface PageProps {
  params: {
-    organizationSlug: string;
    projectId: string;
  };
 }
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/page.tsx
@@ -1,5 +1,4 @@
 import ClickToCopy from '@/components/click-to-copy';
-import { ListPropertiesIcon } from '@/components/events/list-properties-icon';
 import { ProfileAvatar } from '@/components/profiles/profile-avatar';
 import { Padding } from '@/components/ui/padding';
 import { getProfileName } from '@/utils/getters';
@@ -16,7 +15,6 @@ import ProfileMetrics from './profile-metrics';

 interface PageProps {
  params: {
-    organizationSlug: string;
    projectId: string;
    profileId: string;
  };
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/page.tsx
@@ -8,7 +8,6 @@ import Profiles from './profiles';
 interface PageProps {
  params: {
    projectId: string;
-    organizationSlug: string;
  };
  searchParams: Record<string, string>;
 }
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/realtime/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/realtime/page.tsx
@@ -13,7 +13,6 @@ import RealtimeReloader from './realtime-reloader';

 type Props = {
  params: {
-    organizationSlug: string;
    projectId: string;
  };
 };
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/invites/create-invite.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/invites/create-invite.tsx
@@ -35,12 +35,12 @@ interface Props {

 export default function CreateInvite({ projects }: Props) {
  const router = useRouter();
-  const { organizationSlug } = useAppParams();
+  const { organizationId } = useAppParams();

  const { register, handleSubmit, formState, reset, control } = useForm<IForm>({
    resolver: zodResolver(zInviteUser),
    defaultValues: {
-      organizationSlug,
+      organizationId,
      access: [],
      role: 'org:member',
    },
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/invites/index.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/invites/index.tsx
@@ -1,18 +1,18 @@
 import { TableButtons } from '@/components/data-table';
 import { InvitesTable } from '@/components/settings/invites';

-import { getInvites, getProjectsByOrganizationSlug } from '@openpanel/db';
+import { getInvites, getProjectsByOrganizationId } from '@openpanel/db';

 import CreateInvite from './create-invite';

 interface Props {
-  organizationSlug: string;
+  organizationId: string;
 }

-const InvitesServer = async ({ organizationSlug }: Props) => {
+const InvitesServer = async ({ organizationId }: Props) => {
  const [invites, projects] = await Promise.all([
-    getInvites(organizationSlug),
-    getProjectsByOrganizationSlug(organizationSlug),
+    getInvites(organizationId),
+    getProjectsByOrganizationId(organizationId),
  ]);

  return (
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/members/index.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/members/index.tsx
@@ -1,15 +1,15 @@
 import { MembersTable } from '@/components/settings/members';

-import { getMembers, getProjectsByOrganizationSlug } from '@openpanel/db';
+import { getMembers, getProjectsByOrganizationId } from '@openpanel/db';

 interface Props {
-  organizationSlug: string;
+  organizationId: string;
 }

-const MembersServer = async ({ organizationSlug }: Props) => {
+const MembersServer = async ({ organizationId }: Props) => {
  const [members, projects] = await Promise.all([
-    getMembers(organizationSlug),
-    getProjectsByOrganizationSlug(organizationSlug),
+    getMembers(organizationId),
+    getProjectsByOrganizationId(organizationId),
  ]);

  return <MembersTable data={members} projects={projects} />;
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/organization/page.tsx
@@ -14,13 +14,13 @@ import MembersServer from './members';

 interface PageProps {
  params: {
-    organizationSlug: string;
+    organizationId: string;
  };
  searchParams: Record<string, string>;
 }

 export default async function Page({
-  params: { organizationSlug },
+  params: { organizationId },
  searchParams,
 }: PageProps) {
  const tab = parseAsStringEnum(['org', 'members', 'invites'])
@@ -29,7 +29,7 @@ export default async function Page({
  const session = auth();
  const organization = await db.organization.findUnique({
    where: {
-      id: organizationSlug,
+      id: organizationId,
      members: {
        some: {
          userId: session.userId,
@@ -80,12 +80,8 @@ export default async function Page({
      </PageTabs>

      {tab === 'org' && <EditOrganization organization={organization} />}
-      {tab === 'members' && (
-        <MembersServer organizationSlug={organizationSlug} />
-      )}
-      {tab === 'invites' && (
-        <InvitesServer organizationSlug={organizationSlug} />
-      )}
+      {tab === 'members' && <MembersServer organizationId={organizationId} />}
+      {tab === 'invites' && <InvitesServer organizationId={organizationId} />}
    </Padding>
  );
 }
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/projects/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/projects/page.tsx
@@ -1,25 +1,22 @@
-import PageLayout from '@/app/(app)/[organizationSlug]/[projectId]/page-layout';
 import { Padding } from '@/components/ui/padding';

 import {
-  getClientsByOrganizationSlug,
-  getProjectsByOrganizationSlug,
+  getClientsByOrganizationId,
+  getProjectsByOrganizationId,
 } from '@openpanel/db';

 import ListProjects from './list-projects';

 interface PageProps {
  params: {
-    organizationSlug: string;
+    organizationId: string;
  };
 }

-export default async function Page({
-  params: { organizationSlug },
-}: PageProps) {
+export default async function Page({ params: { organizationId } }: PageProps) {
  const [projects, clients] = await Promise.all([
-    getProjectsByOrganizationSlug(organizationSlug),
-    getClientsByOrganizationSlug(organizationSlug),
+    getProjectsByOrganizationId(organizationId),
+    getClientsByOrganizationId(organizationId),
  ]);

  return (
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/references/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/settings/references/page.tsx
@@ -4,7 +4,6 @@ import ListReferences from './list-references';

 interface PageProps {
  params: {
-    organizationSlug: string;
    projectId: string;
  };
 }
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/page.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/page.tsx
@@ -8,19 +8,17 @@ import { getCurrentOrganizations, getCurrentProjects } from '@openpanel/db';

 interface PageProps {
  params: {
-    organizationSlug: string;
+    organizationId: string;
  };
 }

-export default async function Page({
-  params: { organizationSlug },
-}: PageProps) {
+export default async function Page({ params: { organizationId } }: PageProps) {
  const [organizations, projects] = await Promise.all([
    getCurrentOrganizations(),
-    getCurrentProjects(organizationSlug),
+    getCurrentProjects(organizationId),
  ]);

-  const organization = organizations.find((org) => org.id === organizationSlug);
+  const organization = organizations.find((org) => org.id === organizationId);

  if (!organization) {
    return (
@@ -35,7 +33,7 @@ export default async function Page({
  }

  if (projects.length === 1 && projects[0]) {
-    return redirect(`/${organizationSlug}/${projects[0].id}`);
+    return redirect(`/${organizationId}/${projects[0].id}`);
  }

  return (
--- a/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/connect/page.tsx
+++ b/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/connect/page.tsx
@@ -10,8 +10,8 @@ type Props = {

 const Connect = async ({ params: { projectId } }: Props) => {
  const orgs = await getCurrentOrganizations();
-  const organizationSlug = orgs[0]?.id;
-  if (!organizationSlug) {
+  const organizationId = orgs[0]?.id;
+  if (!organizationId) {
    throw new Error('No organization found');
  }
  const project = await getProjectWithClients(projectId);
--- a/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/verify/onboarding-verify.tsx
+++ b/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/verify/onboarding-verify.tsx
@@ -72,7 +72,7 @@ const Verify = ({ project, events }: Props) => {
        <div className="flex items-center gap-8">
          {!verified && (
            <Link
-              href={`/${project.organizationSlug}/${project.id}`}
+              href={`/${project.organizationId}/${project.id}`}
              className=" text-muted-foreground underline"
            >
              Skip for now
--- a/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/verify/page.tsx
+++ b/apps/dashboard/src/app/(onboarding)/onboarding/[projectId]/verify/page.tsx
@@ -18,8 +18,8 @@ type Props = {

 const Verify = async ({ params: { projectId } }: Props) => {
  const orgs = await getCurrentOrganizations();
-  const organizationSlug = orgs[0]?.id;
-  if (!organizationSlug) {
+  const organizationId = orgs[0]?.id;
+  if (!organizationId) {
    throw new Error('No organization found');
  }
  const [project, events] = await Promise.all([
--- a/apps/dashboard/src/app/(onboarding)/onboarding/onboarding-tracking.tsx
+++ b/apps/dashboard/src/app/(onboarding)/onboarding/onboarding-tracking.tsx
@@ -100,7 +100,7 @@ const Tracking = ({
          {organizations.length > 0 ? (
            <Controller
              control={form.control}
-              name="organizationSlug"
+              name="organizationId"
              render={({ field, formState }) => {
                return (
                  <div>
@@ -109,7 +109,7 @@ const Tracking = ({
                      className="w-full"
                      placeholder="Select workspace"
                      icon={Building}
-                      error={formState.errors.organizationSlug?.message}
+                      error={formState.errors.organizationId?.message}
                      value={field.value}
                      items={
                        organizations
--- a/apps/dashboard/src/app/(public)/share/overview/[id]/page.tsx
+++ b/apps/dashboard/src/app/(public)/share/overview/[id]/page.tsx
@@ -1,9 +1,7 @@
 import { StickyBelowHeader } from '@/app/(app)/[organizationSlug]/[projectId]/layout-sticky-below-header';
 import { OverviewReportRange } from '@/app/(app)/[organizationSlug]/[projectId]/overview-sticky-header';
-import { Logo } from '@/components/logo';
 import { OverviewFiltersButtons } from '@/components/overview/filters/overview-filters-buttons';
 import ServerLiveCounter from '@/components/overview/live-counter';
-import { OverviewLiveHistogram } from '@/components/overview/overview-live-histogram';
 import OverviewMetrics from '@/components/overview/overview-metrics';
 import OverviewTopDevices from '@/components/overview/overview-top-devices';
 import OverviewTopEvents from '@/components/overview/overview-top-events';
@@ -35,7 +33,7 @@ export default async function Page({
    return notFound();
  }
  const projectId = share.projectId;
-  const organization = await getOrganizationBySlug(share.organizationSlug);
+  const organization = await getOrganizationBySlug(share.organizationId);

  return (
    <div>
--- a/apps/dashboard/src/app/api/clerk/webhook/route.ts
+++ b/apps/dashboard/src/app/api/clerk/webhook/route.ts
@@ -54,7 +54,6 @@ export async function POST(request: Request) {
          data: access
            .filter((a) => typeof a === 'string')
            .map((projectId) => ({
-              organizationSlug: membership.organizationId,
              organizationId: membership.organizationId,
              projectId: projectId,
              userId: user.id,
@@ -72,7 +71,6 @@ export async function POST(request: Request) {
        data: access
          .filter((a): a is string => typeof a === 'string')
          .map((projectId) => ({
-            organizationSlug: payload.data.organization.slug,
            organizationId: payload.data.organization.slug,
            projectId: projectId,
            userId: payload.data.public_user_data.user_id,
@@ -110,7 +108,7 @@ export async function POST(request: Request) {
  if (payload.type === 'organizationMembership.deleted') {
    await db.projectAccess.deleteMany({
      where: {
-        organizationSlug: payload.data.organization.slug,
+        organizationId: payload.data.organization.slug,
        userId: payload.data.public_user_data.user_id,
      },
    });
--- a/apps/dashboard/src/components/events/event-list-item.tsx
+++ b/apps/dashboard/src/components/events/event-list-item.tsx
@@ -16,7 +16,7 @@ import { EventIcon } from './event-icon';
 type EventListItemProps = IServiceEventMinimal | IServiceEvent;

 export function EventListItem(props: EventListItemProps) {
-  const { organizationSlug, projectId } = useAppParams();
+  const { organizationId, projectId } = useAppParams();
  const { createdAt, name, path, duration, meta } = props;
  const profile = 'profile' in props ? props.profile : null;

@@ -88,7 +88,7 @@ export function EventListItem(props: EventListItemProps) {
              onClick={(e) => {
                e.stopPropagation();
              }}
-              href={`/${organizationSlug}/${projectId}/profiles/${profile?.id}`}
+              href={`/${organizationId}/${projectId}/profiles/${profile?.id}`}
              className="max-w-[80px] overflow-hidden text-ellipsis whitespace-nowrap  text-muted-foreground hover:underline"
            >
              {getProfileName(profile)}
--- a/apps/dashboard/src/components/links.tsx
+++ b/apps/dashboard/src/components/links.tsx
@@ -10,12 +10,12 @@ export function ProjectLink({
  className?: string;
  title?: string;
 }) {
-  const { organizationSlug, projectId } = useAppParams();
+  const { organizationId, projectId } = useAppParams();
  if (typeof props.href === 'string') {
    return (
      <Link
        {...props}
-        href={`/${organizationSlug}/${projectId}/${props.href.replace(
+        href={`/${organizationId}/${projectId}/${props.href.replace(
          /^\//,
          '',
        )}`}
--- a/apps/dashboard/src/components/projects/project-card.tsx
+++ b/apps/dashboard/src/components/projects/project-card.tsx
@@ -8,13 +8,13 @@ import { TABLE_NAMES, chQuery } from '@openpanel/db';
 import { ChartSSR } from '../chart-ssr';
 import { FadeIn } from '../fade-in';

-function ProjectCard({ id, name, organizationSlug }: IServiceProject) {
+function ProjectCard({ id, name, organizationId }: IServiceProject) {
  // For some unknown reason I get when navigating back to this page when using <Link />
  // Should be solved: https://github.com/vercel/next.js/issues/61336
  // But still get the error
  return (
    <a
-      href={`/${organizationSlug}/${id}`}
+      href={`/${organizationId}/${id}`}
      className="card inline-flex flex-col gap-2 p-4 transition-transform hover:-translate-y-1"
    >
      <div className="font-medium">{name}</div>
--- a/apps/dashboard/src/components/settings/members/columns.tsx
+++ b/apps/dashboard/src/components/settings/members/columns.tsx
@@ -96,7 +96,7 @@ function AccessCell({
        setAccess(newAccess);
        mutation.mutate({
          userId: row.original.user!.id,
-          organizationSlug: row.original.organizationId,
+          organizationId: row.original.organizationId,
          access: newAccess as string[],
        });
      }}
--- a/apps/dashboard/src/hooks/useAppParams.ts
+++ b/apps/dashboard/src/hooks/useAppParams.ts
@@ -1,16 +1,14 @@
 import { useParams } from 'next/navigation';

 type AppParams = {
-  organizationSlug: string;
  organizationId: string;
  projectId: string;
 };

 export function useAppParams<T>() {
-  const params = useParams<T & AppParams>();
+  const params = useParams<T & AppParams & { organizationSlug: string }>();
  return {
    ...(params ?? {}),
-    organizationSlug: params?.organizationSlug,
    organizationId: params?.organizationSlug,
    projectId: params?.projectId,
  } as T & AppParams;
--- a/apps/dashboard/src/modals/AddClient.tsx
+++ b/apps/dashboard/src/modals/AddClient.tsx
@@ -39,7 +39,7 @@ interface Props {
  projectId: string;
 }
 export default function AddClient(props: Props) {
-  const { organizationSlug, projectId } = useAppParams();
+  const { organizationId, projectId } = useAppParams();
  const router = useRouter();
  const form = useForm<IForm>({
    resolver: zodResolver(validation),
@@ -60,7 +60,7 @@ export default function AddClient(props: Props) {
    },
  });
  const query = api.project.list.useQuery({
-    organizationSlug,
+    organizationId,
  });
  const onSubmit: SubmitHandler<IForm> = (values) => {
    if (hasDomain && values.cors === '') {
@@ -73,7 +73,7 @@ export default function AddClient(props: Props) {
      name: values.name,
      cors: hasDomain ? values.cors : null,
      projectId: values.projectId,
-      organizationSlug,
+      organizationId,
      type: values.type,
      crossDomain: values.crossDomain,
    });
--- a/apps/dashboard/src/modals/AddDashboard.tsx
+++ b/apps/dashboard/src/modals/AddDashboard.tsx
@@ -19,7 +19,7 @@ const validator = z.object({
 type IForm = z.infer<typeof validator>;

 export default function AddDashboard() {
-  const { projectId, organizationSlug } = useAppParams();
+  const { projectId, organizationId } = useAppParams();
  const router = useRouter();

  const { register, handleSubmit, formState } = useForm<IForm>({
@@ -32,7 +32,7 @@ export default function AddDashboard() {
  const mutation = api.dashboard.create.useMutation({
    onError: handleError,
    onSuccess(res) {
-      router.push(`/${organizationSlug}/${projectId}/dashboards/${res.id}`);
+      router.push(`/${organizationId}/${projectId}/dashboards/${res.id}`);
      toast('Success', {
        description: 'Dashboard created.',
      });
--- a/apps/dashboard/src/modals/AddProject.tsx
+++ b/apps/dashboard/src/modals/AddProject.tsx
@@ -19,7 +19,7 @@ const validator = z.object({
 type IForm = z.infer<typeof validator>;

 export default function AddProject() {
-  const { organizationSlug } = useAppParams();
+  const { organizationId } = useAppParams();
  const router = useRouter();
  const mutation = api.project.create.useMutation({
    onError: handleError,
@@ -45,7 +45,7 @@ export default function AddProject() {
        onSubmit={handleSubmit((values) => {
          mutation.mutate({
            ...values,
-            organizationSlug,
+            organizationId,
          });
        })}
      >
--- a/apps/dashboard/src/modals/SaveReport.tsx
+++ b/apps/dashboard/src/modals/SaveReport.tsx
@@ -30,7 +30,7 @@ type IForm = z.infer<typeof validator>;

 export default function SaveReport({ report }: SaveReportProps) {
  const router = useRouter();
-  const { organizationSlug, projectId } = useAppParams();
+  const { organizationId, projectId } = useAppParams();
  const searchParams = useSearchParams();
  const dashboardId = searchParams?.get('dashboardId') ?? undefined;

@@ -42,7 +42,7 @@ export default function SaveReport({ report }: SaveReportProps) {
      });
      popModal();
      router.push(
-        `/${organizationSlug}/${projectId}/reports/${
+        `/${organizationId}/${projectId}/reports/${
          res.id
        }?${searchParams?.toString()}`,
      );
--- a/apps/dashboard/src/modals/ShareOverviewModal.tsx
+++ b/apps/dashboard/src/modals/ShareOverviewModal.tsx
@@ -20,7 +20,7 @@ const validator = zShareOverview;
 type IForm = z.infer<typeof validator>;

 export default function ShareOverviewModal() {
-  const { projectId, organizationSlug } = useAppParams();
+  const { projectId, organizationId } = useAppParams();
  const router = useRouter();

  const { register, handleSubmit, control } = useForm<IForm>({
@@ -29,7 +29,7 @@ export default function ShareOverviewModal() {
      public: true,
      password: '',
      projectId,
-      organizationSlug,
+      organizationId,
    },
  });