mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: format with prettier
This commit is contained in:
swve
parent
03fb09c3d6
commit
a147ad6610
164 changed files with 11257 additions and 8154 deletions
|
|
@ -1,139 +1,135 @@
|
|||
'use client';
|
||||
import { useOrg } from '@components/Contexts/OrgContext';
|
||||
import { useSession } from '@components/Contexts/SessionContext';
|
||||
import { usePathname, useRouter } from 'next/navigation';
|
||||
'use client'
|
||||
import { useOrg } from '@components/Contexts/OrgContext'
|
||||
import { useSession } from '@components/Contexts/SessionContext'
|
||||
import { usePathname, useRouter } from 'next/navigation'
|
||||
import React from 'react'
|
||||
|
||||
type AuthorizationProps = {
|
||||
children: React.ReactNode;
|
||||
// Authorize components rendering or page rendering
|
||||
authorizationMode: 'component' | 'page';
|
||||
children: React.ReactNode
|
||||
// Authorize components rendering or page rendering
|
||||
authorizationMode: 'component' | 'page'
|
||||
}
|
||||
|
||||
const ADMIN_PATHS = [
|
||||
'/dash/org/*',
|
||||
'/dash/org',
|
||||
'/dash/users/*',
|
||||
'/dash/users',
|
||||
'/dash/courses/*',
|
||||
'/dash/courses',
|
||||
'/dash/org/settings/general',
|
||||
'/dash/org/*',
|
||||
'/dash/org',
|
||||
'/dash/users/*',
|
||||
'/dash/users',
|
||||
'/dash/courses/*',
|
||||
'/dash/courses',
|
||||
'/dash/org/settings/general',
|
||||
]
|
||||
|
||||
function AdminAuthorization(props: AuthorizationProps) {
|
||||
const session = useSession() as any;
|
||||
const org = useOrg() as any;
|
||||
const pathname = usePathname();
|
||||
const router = useRouter();
|
||||
const session = useSession() as any
|
||||
const org = useOrg() as any
|
||||
const pathname = usePathname()
|
||||
const router = useRouter()
|
||||
|
||||
// States
|
||||
const [isLoading, setIsLoading] = React.useState(true);
|
||||
const [isAuthorized, setIsAuthorized] = React.useState(false);
|
||||
// States
|
||||
const [isLoading, setIsLoading] = React.useState(true)
|
||||
const [isAuthorized, setIsAuthorized] = React.useState(false)
|
||||
|
||||
|
||||
// Verify if the user is authenticated
|
||||
const isUserAuthenticated = () => {
|
||||
if (session.isAuthenticated === true) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
return false;
|
||||
}
|
||||
// Verify if the user is authenticated
|
||||
const isUserAuthenticated = () => {
|
||||
if (session.isAuthenticated === true) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// Verify if the user is an Admin (1), Maintainer (2) or Member (3) of the organization
|
||||
const isUserAdmin = () => {
|
||||
const isAdmin = session.roles.some((role: any) => {
|
||||
return (
|
||||
role.org.id === org.id &&
|
||||
(role.role.id === 1 ||
|
||||
role.role.id === 2 ||
|
||||
role.role.role_uuid === 'role_global_admin' ||
|
||||
role.role.role_uuid === 'role_global_maintainer'
|
||||
)
|
||||
);
|
||||
});
|
||||
return isAdmin;
|
||||
};
|
||||
// Verify if the user is an Admin (1), Maintainer (2) or Member (3) of the organization
|
||||
const isUserAdmin = () => {
|
||||
const isAdmin = session.roles.some((role: any) => {
|
||||
return (
|
||||
role.org.id === org.id &&
|
||||
(role.role.id === 1 ||
|
||||
role.role.id === 2 ||
|
||||
role.role.role_uuid === 'role_global_admin' ||
|
||||
role.role.role_uuid === 'role_global_maintainer')
|
||||
)
|
||||
})
|
||||
return isAdmin
|
||||
}
|
||||
|
||||
function checkPathname(pattern: string, pathname: string) {
|
||||
// Escape special characters in the pattern and replace '*' with a regex pattern
|
||||
const regexPattern = new RegExp(`^${pattern.replace(/\//g, '\\/').replace(/\*/g, '.*')}$`);
|
||||
|
||||
// Test if the pathname matches the regex pattern
|
||||
const isMatch = regexPattern.test(pathname);
|
||||
|
||||
return isMatch;
|
||||
}
|
||||
|
||||
|
||||
const Authorize = () => {
|
||||
if (props.authorizationMode === 'page') {
|
||||
|
||||
// Check if user is in an admin path
|
||||
if (ADMIN_PATHS.some((path) => checkPathname(path, pathname))) {
|
||||
console.log('Admin path')
|
||||
if (isUserAuthenticated()) {
|
||||
// Check if the user is an Admin
|
||||
if (isUserAdmin()) {
|
||||
setIsAuthorized(true);
|
||||
}
|
||||
else {
|
||||
setIsAuthorized(false);
|
||||
router.push('/dash');
|
||||
}
|
||||
}
|
||||
else {
|
||||
router.push('/login');
|
||||
}
|
||||
}
|
||||
|
||||
else {
|
||||
if (isUserAuthenticated()) {
|
||||
setIsAuthorized(true);
|
||||
}
|
||||
else {
|
||||
setIsAuthorized(false);
|
||||
router.push('/login');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (props.authorizationMode === 'component') {
|
||||
// Component mode
|
||||
if (isUserAuthenticated() && isUserAdmin()) {
|
||||
setIsAuthorized(true);
|
||||
}
|
||||
else {
|
||||
setIsAuthorized(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
if (session.isLoading) {
|
||||
return;
|
||||
}
|
||||
|
||||
Authorize();
|
||||
setIsLoading(false);
|
||||
}, [session, org, pathname])
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
{props.authorizationMode === 'component' && isAuthorized === true && props.children}
|
||||
{props.authorizationMode === 'page' && isAuthorized === true && !isLoading && props.children}
|
||||
{props.authorizationMode === 'page' && isAuthorized === false && !isLoading &&
|
||||
<div className='flex justify-center items-center h-screen'>
|
||||
<h1 className='text-2xl'>You are not authorized to access this page</h1>
|
||||
</div>
|
||||
}
|
||||
|
||||
</>
|
||||
function checkPathname(pattern: string, pathname: string) {
|
||||
// Escape special characters in the pattern and replace '*' with a regex pattern
|
||||
const regexPattern = new RegExp(
|
||||
`^${pattern.replace(/\//g, '\\/').replace(/\*/g, '.*')}$`
|
||||
)
|
||||
|
||||
// Test if the pathname matches the regex pattern
|
||||
const isMatch = regexPattern.test(pathname)
|
||||
|
||||
return isMatch
|
||||
}
|
||||
|
||||
const Authorize = () => {
|
||||
if (props.authorizationMode === 'page') {
|
||||
// Check if user is in an admin path
|
||||
if (ADMIN_PATHS.some((path) => checkPathname(path, pathname))) {
|
||||
console.log('Admin path')
|
||||
if (isUserAuthenticated()) {
|
||||
// Check if the user is an Admin
|
||||
if (isUserAdmin()) {
|
||||
setIsAuthorized(true)
|
||||
} else {
|
||||
setIsAuthorized(false)
|
||||
router.push('/dash')
|
||||
}
|
||||
} else {
|
||||
router.push('/login')
|
||||
}
|
||||
} else {
|
||||
if (isUserAuthenticated()) {
|
||||
setIsAuthorized(true)
|
||||
} else {
|
||||
setIsAuthorized(false)
|
||||
router.push('/login')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (props.authorizationMode === 'component') {
|
||||
// Component mode
|
||||
if (isUserAuthenticated() && isUserAdmin()) {
|
||||
setIsAuthorized(true)
|
||||
} else {
|
||||
setIsAuthorized(false)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
if (session.isLoading) {
|
||||
return
|
||||
}
|
||||
|
||||
Authorize()
|
||||
setIsLoading(false)
|
||||
}, [session, org, pathname])
|
||||
|
||||
return (
|
||||
<>
|
||||
{props.authorizationMode === 'component' &&
|
||||
isAuthorized === true &&
|
||||
props.children}
|
||||
{props.authorizationMode === 'page' &&
|
||||
isAuthorized === true &&
|
||||
!isLoading &&
|
||||
props.children}
|
||||
{props.authorizationMode === 'page' &&
|
||||
isAuthorized === false &&
|
||||
!isLoading && (
|
||||
<div className="flex justify-center items-center h-screen">
|
||||
<h1 className="text-2xl">
|
||||
You are not authorized to access this page
|
||||
</h1>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default AdminAuthorization
|
||||
export default AdminAuthorization
|
||||
|
|
|
|||
|
|
@ -1,77 +1,82 @@
|
|||
'use client';
|
||||
import React from "react";
|
||||
import { useSession } from "@components/Contexts/SessionContext";
|
||||
import { useOrg } from "@components/Contexts/OrgContext";
|
||||
'use client'
|
||||
import React from 'react'
|
||||
import { useSession } from '@components/Contexts/SessionContext'
|
||||
import { useOrg } from '@components/Contexts/OrgContext'
|
||||
|
||||
interface AuthenticatedClientElementProps {
|
||||
children: React.ReactNode;
|
||||
checkMethod: 'authentication' | 'roles';
|
||||
orgId?: string;
|
||||
ressourceType?: 'collections' | 'courses' | 'activities' | 'users' | 'organizations';
|
||||
action?: 'create' | 'update' | 'delete' | 'read';
|
||||
children: React.ReactNode
|
||||
checkMethod: 'authentication' | 'roles'
|
||||
orgId?: string
|
||||
ressourceType?:
|
||||
| 'collections'
|
||||
| 'courses'
|
||||
| 'activities'
|
||||
| 'users'
|
||||
| 'organizations'
|
||||
action?: 'create' | 'update' | 'delete' | 'read'
|
||||
}
|
||||
|
||||
export const AuthenticatedClientElement = (
|
||||
props: AuthenticatedClientElementProps
|
||||
) => {
|
||||
const [isAllowed, setIsAllowed] = React.useState(false)
|
||||
const session = useSession() as any
|
||||
const org = useOrg() as any
|
||||
|
||||
|
||||
export const AuthenticatedClientElement = (props: AuthenticatedClientElementProps) => {
|
||||
const [isAllowed, setIsAllowed] = React.useState(false);
|
||||
const session = useSession() as any;
|
||||
const org = useOrg() as any;
|
||||
|
||||
|
||||
function isUserAllowed(roles: any[], action: string, resourceType: string, org_uuid: string): boolean {
|
||||
// Iterate over the user's roles
|
||||
for (const role of roles) {
|
||||
|
||||
// Check if the role is for the right organization
|
||||
if (role.org.org_uuid === org_uuid) {
|
||||
// Check if the user has the role for the resource type
|
||||
if (role.role.rights && role.role.rights[resourceType]) {
|
||||
|
||||
|
||||
// Check if the user is allowed to execute the action
|
||||
const actionKey = `action_${action}`;
|
||||
if (role.role.rights[resourceType][actionKey] === true) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
function isUserAllowed(
|
||||
roles: any[],
|
||||
action: string,
|
||||
resourceType: string,
|
||||
org_uuid: string
|
||||
): boolean {
|
||||
// Iterate over the user's roles
|
||||
for (const role of roles) {
|
||||
// Check if the role is for the right organization
|
||||
if (role.org.org_uuid === org_uuid) {
|
||||
// Check if the user has the role for the resource type
|
||||
if (role.role.rights && role.role.rights[resourceType]) {
|
||||
// Check if the user is allowed to execute the action
|
||||
const actionKey = `action_${action}`
|
||||
if (role.role.rights[resourceType][actionKey] === true) {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
// If no role matches the organization, resource type, and action, return false
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function check() {
|
||||
if (session.isAuthenticated === false) {
|
||||
setIsAllowed(false);
|
||||
return;
|
||||
}
|
||||
else {
|
||||
if (props.checkMethod === 'authentication') {
|
||||
setIsAllowed(session.isAuthenticated);
|
||||
} else if (props.checkMethod === 'roles') {
|
||||
return setIsAllowed(isUserAllowed(session.roles, props.action!, props.ressourceType!, org.org_uuid));
|
||||
}
|
||||
}
|
||||
// If no role matches the organization, resource type, and action, return false
|
||||
return false
|
||||
}
|
||||
|
||||
function check() {
|
||||
if (session.isAuthenticated === false) {
|
||||
setIsAllowed(false)
|
||||
return
|
||||
} else {
|
||||
if (props.checkMethod === 'authentication') {
|
||||
setIsAllowed(session.isAuthenticated)
|
||||
} else if (props.checkMethod === 'roles') {
|
||||
return setIsAllowed(
|
||||
isUserAllowed(
|
||||
session.roles,
|
||||
props.action!,
|
||||
props.ressourceType!,
|
||||
org.org_uuid
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
if (session.isLoading) {
|
||||
return
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
if (session.isLoading) {
|
||||
return;
|
||||
}
|
||||
|
||||
check();
|
||||
}, [session, org])
|
||||
|
||||
return (
|
||||
<>
|
||||
{isAllowed && props.children}
|
||||
</>
|
||||
)
|
||||
|
||||
check()
|
||||
}, [session, org])
|
||||
|
||||
return <>{isAllowed && props.children}</>
|
||||
}
|
||||
|
||||
export default AuthenticatedClientElement
|
||||
export default AuthenticatedClientElement
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
'use client';
|
||||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import Link from "next/link";
|
||||
import { Settings } from "lucide-react";
|
||||
import { useSession } from "@components/Contexts/SessionContext";
|
||||
import UserAvatar from "@components/Objects/UserAvatar";
|
||||
'use client'
|
||||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
import Link from 'next/link'
|
||||
import { Settings } from 'lucide-react'
|
||||
import { useSession } from '@components/Contexts/SessionContext'
|
||||
import UserAvatar from '@components/Objects/UserAvatar'
|
||||
|
||||
export const HeaderProfileBox = () => {
|
||||
const session = useSession() as any;
|
||||
const session = useSession() as any
|
||||
|
||||
return (
|
||||
<ProfileArea>
|
||||
|
|
@ -15,14 +15,10 @@ export const HeaderProfileBox = () => {
|
|||
<UnidentifiedArea className="flex text-sm text-gray-700 font-bold p-1.5 px-2 rounded-lg">
|
||||
<ul className="flex space-x-3 items-center">
|
||||
<li>
|
||||
<Link href="/login">
|
||||
Login
|
||||
</Link>
|
||||
<Link href="/login">Login</Link>
|
||||
</li>
|
||||
<li className="bg-black rounded-lg shadow-md p-2 px-3 text-white">
|
||||
<Link href="/signup">
|
||||
Sign up
|
||||
</Link>
|
||||
<Link href="/signup">Sign up</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</UnidentifiedArea>
|
||||
|
|
@ -32,35 +28,35 @@ export const HeaderProfileBox = () => {
|
|||
<div className="flex items-center space-x-2">
|
||||
<div className="text-xs">{session.user.username} </div>
|
||||
<div className="py-4">
|
||||
<UserAvatar border="border-4" rounded='rounded-lg' width={30} />
|
||||
<UserAvatar border="border-4" rounded="rounded-lg" width={30} />
|
||||
</div>
|
||||
<Link className="text-gray-600" href={"/dash"}><Settings size={14} /></Link>
|
||||
<Link className="text-gray-600" href={'/dash'}>
|
||||
<Settings size={14} />
|
||||
</Link>
|
||||
</div>
|
||||
</AccountArea>
|
||||
)}
|
||||
</ProfileArea>
|
||||
);
|
||||
};
|
||||
)
|
||||
}
|
||||
|
||||
const AccountArea = styled.div`
|
||||
display: flex;
|
||||
place-items: center;
|
||||
|
||||
|
||||
img {
|
||||
width: 29px;
|
||||
}
|
||||
`;
|
||||
`
|
||||
|
||||
const ProfileArea = styled.div`
|
||||
display: flex;
|
||||
place-items: stretch;
|
||||
place-items: center;
|
||||
`;
|
||||
`
|
||||
|
||||
const UnidentifiedArea = styled.div`
|
||||
display: flex;
|
||||
place-items: stretch;
|
||||
flex-grow: 1;
|
||||
|
||||
|
||||
`;
|
||||
`
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue