mirror of https://github.com/buster-so/buster.git
feat: update AppNoPageAccess to show Login for unauthenticated users and embed pages
- Add authentication state detection using useSupabaseContext - Detect embed page context using window.location.pathname - Show 'Login' button with redirect parameter for unauthenticated users or embed pages - Keep 'Go home' button for authenticated users without asset access - Include current URL as redirect parameter in login link Co-Authored-By: nate@buster.so <nate@buster.so>
This commit is contained in:
parent
cd173c4fd4
commit
82d75da0a7
|
@ -1,29 +1,58 @@
|
|||
'use client';
|
||||
|
||||
import Link from 'next/link';
|
||||
import React from 'react';
|
||||
import React, { useMemo } from 'react';
|
||||
import { BusterLogo } from '@/assets/svg/BusterLogo';
|
||||
import { Button } from '@/components/ui/buttons';
|
||||
import { Title } from '@/components/ui/typography';
|
||||
import { useSupabaseContext } from '@/context/Supabase';
|
||||
import { BusterRoutes, createBusterRoute } from '@/routes';
|
||||
|
||||
export const AppNoPageAccess: React.FC<{
|
||||
assetId: string;
|
||||
}> = React.memo(({ assetId }) => {
|
||||
const isAnonymousUser = useSupabaseContext((x) => x.isAnonymousUser);
|
||||
|
||||
const { buttonText, linkUrl } = useMemo(() => {
|
||||
const isEmbedPage = typeof window !== 'undefined' && window.location.pathname.startsWith('/embed');
|
||||
|
||||
const shouldShowLogin = isAnonymousUser || isEmbedPage;
|
||||
|
||||
if (shouldShowLogin) {
|
||||
const currentUrl = typeof window !== 'undefined'
|
||||
? `${window.location.pathname}${window.location.search}`
|
||||
: '';
|
||||
|
||||
return {
|
||||
buttonText: 'Login',
|
||||
linkUrl: createBusterRoute({
|
||||
route: BusterRoutes.AUTH_LOGIN,
|
||||
next: encodeURIComponent(currentUrl)
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
buttonText: 'Go home',
|
||||
linkUrl: createBusterRoute({
|
||||
route: BusterRoutes.APP_HOME
|
||||
})
|
||||
};
|
||||
}, [isAnonymousUser]);
|
||||
|
||||
return (
|
||||
<div className="flex h-[85vh] w-full flex-col items-center justify-center space-y-6">
|
||||
<BusterLogo className="h-16 w-16" />
|
||||
|
||||
<div className="max-w-[440px] text-center">
|
||||
<Title as="h2" className="text-center">
|
||||
{'It looks like you don’t have access to this file...'}
|
||||
{"It looks like you don't have access to this file..."}
|
||||
</Title>
|
||||
</div>
|
||||
|
||||
<div className="flex space-x-2">
|
||||
<Link
|
||||
href={createBusterRoute({
|
||||
route: BusterRoutes.APP_HOME
|
||||
})}>
|
||||
<Button>Go home</Button>
|
||||
<Link href={linkUrl}>
|
||||
<Button>{buttonText}</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue