feat: show new workspace modal when user is not a member of any workspaces
This commit is contained in:
@@ -7,6 +7,7 @@ import { api } from "~/utils/api";
|
|||||||
interface WorkspaceContextProps {
|
interface WorkspaceContextProps {
|
||||||
workspace: Workspace;
|
workspace: Workspace;
|
||||||
isLoading: boolean;
|
isLoading: boolean;
|
||||||
|
hasLoaded: boolean;
|
||||||
switchWorkspace: (_workspace: Workspace) => void;
|
switchWorkspace: (_workspace: Workspace) => void;
|
||||||
availableWorkspaces: Workspace[];
|
availableWorkspaces: Workspace[];
|
||||||
}
|
}
|
||||||
@@ -43,6 +44,7 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
|
|||||||
const [availableWorkspaces, setAvailableWorkspaces] = useState<Workspace[]>(
|
const [availableWorkspaces, setAvailableWorkspaces] = useState<Workspace[]>(
|
||||||
initialAvailableWorkspaces,
|
initialAvailableWorkspaces,
|
||||||
);
|
);
|
||||||
|
const [hasLoaded, setHasLoaded] = useState(false);
|
||||||
|
|
||||||
const { data, isLoading } = api.workspace.all.useQuery();
|
const { data, isLoading } = api.workspace.all.useQuery();
|
||||||
|
|
||||||
@@ -55,7 +57,10 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!data) return;
|
if (!data?.length) {
|
||||||
|
if (!isLoading) setHasLoaded(true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const storedWorkspaceId: string | null =
|
const storedWorkspaceId: string | null =
|
||||||
localStorage.getItem("workspacePublicId");
|
localStorage.getItem("workspacePublicId");
|
||||||
@@ -72,6 +77,7 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
|
|||||||
slug: workspace.slug,
|
slug: workspace.slug,
|
||||||
description: workspace.description,
|
description: workspace.description,
|
||||||
plan: workspace.plan,
|
plan: workspace.plan,
|
||||||
|
hasLoaded: true,
|
||||||
};
|
};
|
||||||
})
|
})
|
||||||
.filter((workspace) => workspace !== null) as Workspace[];
|
.filter((workspace) => workspace !== null) as Workspace[];
|
||||||
@@ -82,7 +88,7 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
|
|||||||
if (storedWorkspaceId !== null) {
|
if (storedWorkspaceId !== null) {
|
||||||
const newData = data;
|
const newData = data;
|
||||||
const selectedWorkspace = newData.find(
|
const selectedWorkspace = newData.find(
|
||||||
({ workspace }) => workspace?.publicId === storedWorkspaceId,
|
({ workspace }) => workspace.publicId === storedWorkspaceId,
|
||||||
);
|
);
|
||||||
|
|
||||||
if (!selectedWorkspace?.workspace) return;
|
if (!selectedWorkspace?.workspace) return;
|
||||||
@@ -114,7 +120,13 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<WorkspaceContext.Provider
|
<WorkspaceContext.Provider
|
||||||
value={{ workspace, isLoading, availableWorkspaces, switchWorkspace }}
|
value={{
|
||||||
|
workspace,
|
||||||
|
isLoading,
|
||||||
|
hasLoaded,
|
||||||
|
availableWorkspaces,
|
||||||
|
switchWorkspace,
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
</WorkspaceContext.Provider>
|
</WorkspaceContext.Provider>
|
||||||
|
|||||||
@@ -11,7 +11,9 @@ import { NewBoardForm } from "./components/NewBoardForm";
|
|||||||
|
|
||||||
export default function BoardsPage() {
|
export default function BoardsPage() {
|
||||||
const { openModal, modalContentType } = useModal();
|
const { openModal, modalContentType } = useModal();
|
||||||
const { workspace } = useWorkspace();
|
const { workspace, hasLoaded } = useWorkspace();
|
||||||
|
|
||||||
|
if (hasLoaded && !workspace.publicId) openModal("NEW_WORKSPACE");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|||||||
@@ -155,8 +155,8 @@ export const getBySlugWithBoards = (db: dbClient, workspaceSlug: string) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getAllByUserId = (db: dbClient, userId: string) => {
|
export const getAllByUserId = async (db: dbClient, userId: string) => {
|
||||||
return db.query.workspaceMembers.findMany({
|
const result = await db.query.workspaceMembers.findMany({
|
||||||
columns: {
|
columns: {
|
||||||
role: true,
|
role: true,
|
||||||
},
|
},
|
||||||
@@ -168,6 +168,7 @@ export const getAllByUserId = (db: dbClient, userId: string) => {
|
|||||||
description: true,
|
description: true,
|
||||||
slug: true,
|
slug: true,
|
||||||
plan: true,
|
plan: true,
|
||||||
|
deletedAt: true,
|
||||||
},
|
},
|
||||||
// https://github.com/drizzle-team/drizzle-orm/issues/2903
|
// https://github.com/drizzle-team/drizzle-orm/issues/2903
|
||||||
// where: isNull(workspaces.deletedAt),
|
// where: isNull(workspaces.deletedAt),
|
||||||
@@ -179,6 +180,8 @@ export const getAllByUserId = (db: dbClient, userId: string) => {
|
|||||||
isNull(workspaceMembers.deletedAt),
|
isNull(workspaceMembers.deletedAt),
|
||||||
),
|
),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
return result.filter((member) => !member.workspace.deletedAt);
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getMemberByPublicId = (db: dbClient, memberPublicId: string) => {
|
export const getMemberByPublicId = (db: dbClient, memberPublicId: string) => {
|
||||||
@@ -216,7 +219,10 @@ export const isWorkspaceSlugAvailable = async (
|
|||||||
columns: {
|
columns: {
|
||||||
id: true,
|
id: true,
|
||||||
},
|
},
|
||||||
where: eq(workspaces.slug, workspaceSlug),
|
where: and(
|
||||||
|
eq(workspaces.slug, workspaceSlug),
|
||||||
|
isNull(workspaces.deletedAt),
|
||||||
|
),
|
||||||
});
|
});
|
||||||
|
|
||||||
return result === undefined;
|
return result === undefined;
|
||||||
|
|||||||
Reference in New Issue
Block a user