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,108 +1,140 @@
|
|||
'use client';
|
||||
'use client'
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
|
||||
import CreateCourseModal from '@components/Objects/Modals/Course/Create/CreateCourse';
|
||||
import CourseThumbnail from '@components/Objects/Thumbnails/CourseThumbnail';
|
||||
import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement';
|
||||
import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton';
|
||||
import Modal from '@components/StyledElements/Modal/Modal';
|
||||
import { useSearchParams } from 'next/navigation';
|
||||
import CreateCourseModal from '@components/Objects/Modals/Course/Create/CreateCourse'
|
||||
import CourseThumbnail from '@components/Objects/Thumbnails/CourseThumbnail'
|
||||
import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement'
|
||||
import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton'
|
||||
import Modal from '@components/StyledElements/Modal/Modal'
|
||||
import { useSearchParams } from 'next/navigation'
|
||||
import React from 'react'
|
||||
|
||||
type CourseProps = {
|
||||
orgslug: string;
|
||||
courses: any;
|
||||
org_id: string;
|
||||
orgslug: string
|
||||
courses: any
|
||||
org_id: string
|
||||
}
|
||||
|
||||
function CoursesHome(params: CourseProps) {
|
||||
const searchParams = useSearchParams();
|
||||
const isCreatingCourse = searchParams.get('new') ? true : false;
|
||||
const [newCourseModal, setNewCourseModal] = React.useState(isCreatingCourse);
|
||||
const orgslug = params.orgslug;
|
||||
const courses = params.courses;
|
||||
const searchParams = useSearchParams()
|
||||
const isCreatingCourse = searchParams.get('new') ? true : false
|
||||
const [newCourseModal, setNewCourseModal] = React.useState(isCreatingCourse)
|
||||
const orgslug = params.orgslug
|
||||
const courses = params.courses
|
||||
|
||||
async function closeNewCourseModal() {
|
||||
setNewCourseModal(false)
|
||||
}
|
||||
|
||||
async function closeNewCourseModal() {
|
||||
setNewCourseModal(false);
|
||||
}
|
||||
return (
|
||||
<div className="h-full w-full bg-[#f8f8f8]">
|
||||
<div>
|
||||
<div className="pl-10 mr-10 tracking-tighter">
|
||||
<BreadCrumbs type="courses" />
|
||||
|
||||
return (
|
||||
<div className='h-full w-full bg-[#f8f8f8]'>
|
||||
<div >
|
||||
<div className='pl-10 mr-10 tracking-tighter'>
|
||||
<BreadCrumbs type='courses' />
|
||||
|
||||
<div className='w-100 flex justify-between'>
|
||||
<div className='pt-3 flex font-bold text-4xl'>Courses</div>
|
||||
<AuthenticatedClientElement checkMethod='roles'
|
||||
action='create'
|
||||
ressourceType='courses'
|
||||
orgId={params.org_id}>
|
||||
<Modal
|
||||
isDialogOpen={newCourseModal}
|
||||
onOpenChange={setNewCourseModal}
|
||||
minHeight="md"
|
||||
dialogContent={<CreateCourseModal
|
||||
closeModal={closeNewCourseModal}
|
||||
orgslug={orgslug}
|
||||
></CreateCourseModal>}
|
||||
dialogTitle="Create Course"
|
||||
dialogDescription="Create a new course"
|
||||
dialogTrigger={
|
||||
|
||||
<button>
|
||||
<NewCourseButton />
|
||||
</button>}
|
||||
/>
|
||||
</AuthenticatedClientElement>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-wrap mx-8 mt-7">
|
||||
{courses.map((course: any) => (
|
||||
<div className="px-3" key={course.course_uuid}>
|
||||
<CourseThumbnail course={course} orgslug={orgslug} />
|
||||
</div>
|
||||
))}
|
||||
{courses.length == 0 &&
|
||||
<div className="flex mx-auto h-[400px]">
|
||||
<div className="flex flex-col justify-center text-center items-center space-y-5">
|
||||
<div className='mx-auto'>
|
||||
<svg width="120" height="120" viewBox="0 0 295 295" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect opacity="0.51" x="10" y="10" width="275" height="275" rx="75" stroke="#4B5564" strokeOpacity="0.15" strokeWidth="20" />
|
||||
<path d="M135.8 200.8V130L122.2 114.6L135.8 110.4V102.8L122.2 87.4L159.8 76V200.8L174.6 218H121L135.8 200.8Z" fill="#4B5564" fillOpacity="0.08" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="space-y-0">
|
||||
<h1 className="text-3xl font-bold text-gray-600">No courses yet</h1>
|
||||
<p className="text-lg text-gray-400">Create a course to add content</p>
|
||||
</div>
|
||||
<AuthenticatedClientElement
|
||||
action='create'
|
||||
ressourceType='courses'
|
||||
checkMethod='roles' orgId={params.org_id}>
|
||||
<Modal
|
||||
isDialogOpen={newCourseModal}
|
||||
onOpenChange={setNewCourseModal}
|
||||
minHeight="md"
|
||||
dialogContent={<CreateCourseModal
|
||||
closeModal={closeNewCourseModal}
|
||||
orgslug={orgslug}
|
||||
></CreateCourseModal>}
|
||||
dialogTitle="Create Course"
|
||||
dialogDescription="Create a new course"
|
||||
dialogTrigger={
|
||||
<button>
|
||||
<NewCourseButton />
|
||||
</button>}
|
||||
/>
|
||||
</AuthenticatedClientElement>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-100 flex justify-between">
|
||||
<div className="pt-3 flex font-bold text-4xl">Courses</div>
|
||||
<AuthenticatedClientElement
|
||||
checkMethod="roles"
|
||||
action="create"
|
||||
ressourceType="courses"
|
||||
orgId={params.org_id}
|
||||
>
|
||||
<Modal
|
||||
isDialogOpen={newCourseModal}
|
||||
onOpenChange={setNewCourseModal}
|
||||
minHeight="md"
|
||||
dialogContent={
|
||||
<CreateCourseModal
|
||||
closeModal={closeNewCourseModal}
|
||||
orgslug={orgslug}
|
||||
></CreateCourseModal>
|
||||
}
|
||||
</div>
|
||||
dialogTitle="Create Course"
|
||||
dialogDescription="Create a new course"
|
||||
dialogTrigger={
|
||||
<button>
|
||||
<NewCourseButton />
|
||||
</button>
|
||||
}
|
||||
/>
|
||||
</AuthenticatedClientElement>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
</div>
|
||||
<div className="flex flex-wrap mx-8 mt-7">
|
||||
{courses.map((course: any) => (
|
||||
<div className="px-3" key={course.course_uuid}>
|
||||
<CourseThumbnail course={course} orgslug={orgslug} />
|
||||
</div>
|
||||
))}
|
||||
{courses.length == 0 && (
|
||||
<div className="flex mx-auto h-[400px]">
|
||||
<div className="flex flex-col justify-center text-center items-center space-y-5">
|
||||
<div className="mx-auto">
|
||||
<svg
|
||||
width="120"
|
||||
height="120"
|
||||
viewBox="0 0 295 295"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect
|
||||
opacity="0.51"
|
||||
x="10"
|
||||
y="10"
|
||||
width="275"
|
||||
height="275"
|
||||
rx="75"
|
||||
stroke="#4B5564"
|
||||
strokeOpacity="0.15"
|
||||
strokeWidth="20"
|
||||
/>
|
||||
<path
|
||||
d="M135.8 200.8V130L122.2 114.6L135.8 110.4V102.8L122.2 87.4L159.8 76V200.8L174.6 218H121L135.8 200.8Z"
|
||||
fill="#4B5564"
|
||||
fillOpacity="0.08"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
<div className="space-y-0">
|
||||
<h1 className="text-3xl font-bold text-gray-600">
|
||||
No courses yet
|
||||
</h1>
|
||||
<p className="text-lg text-gray-400">
|
||||
Create a course to add content
|
||||
</p>
|
||||
</div>
|
||||
<AuthenticatedClientElement
|
||||
action="create"
|
||||
ressourceType="courses"
|
||||
checkMethod="roles"
|
||||
orgId={params.org_id}
|
||||
>
|
||||
<Modal
|
||||
isDialogOpen={newCourseModal}
|
||||
onOpenChange={setNewCourseModal}
|
||||
minHeight="md"
|
||||
dialogContent={
|
||||
<CreateCourseModal
|
||||
closeModal={closeNewCourseModal}
|
||||
orgslug={orgslug}
|
||||
></CreateCourseModal>
|
||||
}
|
||||
dialogTitle="Create Course"
|
||||
dialogDescription="Create a new course"
|
||||
dialogTrigger={
|
||||
<button>
|
||||
<NewCourseButton />
|
||||
</button>
|
||||
}
|
||||
/>
|
||||
</AuthenticatedClientElement>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default CoursesHome
|
||||
export default CoursesHome
|
||||
|
|
|
|||
|
|
@ -1,72 +1,93 @@
|
|||
'use client';
|
||||
'use client'
|
||||
import EditCourseStructure from '../../../../../../../../components/Dashboard/Course/EditCourseStructure/EditCourseStructure'
|
||||
import { getUriWithOrg } from '@services/config/config';
|
||||
import { getUriWithOrg } from '@services/config/config'
|
||||
import React from 'react'
|
||||
import { CourseProvider } from '../../../../../../../../components/Contexts/CourseContext';
|
||||
import Link from 'next/link';
|
||||
import { CourseOverviewTop } from '@components/Dashboard/UI/CourseOverviewTop';
|
||||
import { motion } from 'framer-motion';
|
||||
import EditCourseGeneral from '@components/Dashboard/Course/EditCourseGeneral/EditCourseGeneral';
|
||||
import { GalleryVerticalEnd, Info } from 'lucide-react';
|
||||
import { CourseProvider } from '../../../../../../../../components/Contexts/CourseContext'
|
||||
import Link from 'next/link'
|
||||
import { CourseOverviewTop } from '@components/Dashboard/UI/CourseOverviewTop'
|
||||
import { motion } from 'framer-motion'
|
||||
import EditCourseGeneral from '@components/Dashboard/Course/EditCourseGeneral/EditCourseGeneral'
|
||||
import { GalleryVerticalEnd, Info } from 'lucide-react'
|
||||
|
||||
export type CourseOverviewParams = {
|
||||
orgslug: string,
|
||||
courseuuid: string,
|
||||
subpage: string
|
||||
orgslug: string
|
||||
courseuuid: string
|
||||
subpage: string
|
||||
}
|
||||
|
||||
|
||||
|
||||
function CourseOverviewPage({ params }: { params: CourseOverviewParams }) {
|
||||
function getEntireCourseUUID(courseuuid: string) {
|
||||
// add course_ to uuid
|
||||
return `course_${courseuuid}`
|
||||
}
|
||||
|
||||
function getEntireCourseUUID(courseuuid: string) {
|
||||
// add course_ to uuid
|
||||
return `course_${courseuuid}`
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='h-screen w-full bg-[#f8f8f8] grid grid-rows-[auto,1fr]'>
|
||||
<CourseProvider courseuuid={getEntireCourseUUID(params.courseuuid)}>
|
||||
<div className='pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]'>
|
||||
<CourseOverviewTop params={params} />
|
||||
<div className='flex space-x-5 font-black text-sm'>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/courses/course/${params.courseuuid}/general`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'general' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/courses/course/${params.courseuuid}/content`}>
|
||||
<div className={`flex space-x-4 py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'content' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<GalleryVerticalEnd size={16} />
|
||||
<div>Content</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
return (
|
||||
<div className="h-screen w-full bg-[#f8f8f8] grid grid-rows-[auto,1fr]">
|
||||
<CourseProvider courseuuid={getEntireCourseUUID(params.courseuuid)}>
|
||||
<div className="pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]">
|
||||
<CourseOverviewTop params={params} />
|
||||
<div className="flex space-x-5 font-black text-sm">
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') +
|
||||
`/dash/courses/course/${params.courseuuid}/general`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'general'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.10, type: "spring", stiffness: 80 }}
|
||||
className='h-full overflow-y-auto'
|
||||
>
|
||||
{params.subpage == 'content' ? <EditCourseStructure orgslug={params.orgslug} /> : ''}
|
||||
{params.subpage == 'general' ? <EditCourseGeneral orgslug={params.orgslug} /> : ''}
|
||||
</motion.div>
|
||||
</CourseProvider>
|
||||
</div>
|
||||
</Link>
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') +
|
||||
`/dash/courses/course/${params.courseuuid}/content`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`flex space-x-4 py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'content'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<GalleryVerticalEnd size={16} />
|
||||
<div>Content</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.1, type: 'spring', stiffness: 80 }}
|
||||
className="h-full overflow-y-auto"
|
||||
>
|
||||
{params.subpage == 'content' ? (
|
||||
<EditCourseStructure orgslug={params.orgslug} />
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
{params.subpage == 'general' ? (
|
||||
<EditCourseGeneral orgslug={params.orgslug} />
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
</motion.div>
|
||||
</CourseProvider>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
export default CourseOverviewPage
|
||||
export default CourseOverviewPage
|
||||
|
|
|
|||
|
|
@ -1,57 +1,63 @@
|
|||
import { getAccessTokenFromRefreshTokenCookie } from '@services/auth/auth';
|
||||
import { getOrgCoursesWithAuthHeader } from '@services/courses/courses';
|
||||
import { getOrganizationContextInfo } from '@services/organizations/orgs';
|
||||
import { Metadata } from 'next';
|
||||
import { cookies } from 'next/headers';
|
||||
import { getAccessTokenFromRefreshTokenCookie } from '@services/auth/auth'
|
||||
import { getOrgCoursesWithAuthHeader } from '@services/courses/courses'
|
||||
import { getOrganizationContextInfo } from '@services/organizations/orgs'
|
||||
import { Metadata } from 'next'
|
||||
import { cookies } from 'next/headers'
|
||||
import React from 'react'
|
||||
import CoursesHome from './client';
|
||||
import CoursesHome from './client'
|
||||
|
||||
type MetadataProps = {
|
||||
params: { orgslug: string };
|
||||
searchParams: { [key: string]: string | string[] | undefined };
|
||||
};
|
||||
params: { orgslug: string }
|
||||
searchParams: { [key: string]: string | string[] | undefined }
|
||||
}
|
||||
|
||||
export async function generateMetadata(
|
||||
{ params }: MetadataProps,
|
||||
): Promise<Metadata> {
|
||||
export async function generateMetadata({
|
||||
params,
|
||||
}: MetadataProps): Promise<Metadata> {
|
||||
// Get Org context information
|
||||
const org = await getOrganizationContextInfo(params.orgslug, {
|
||||
revalidate: 1800,
|
||||
tags: ['organizations'],
|
||||
})
|
||||
|
||||
// Get Org context information
|
||||
const org = await getOrganizationContextInfo(params.orgslug, { revalidate: 1800, tags: ['organizations'] });
|
||||
|
||||
// SEO
|
||||
return {
|
||||
title: "Courses — " + org.name,
|
||||
description: org.description,
|
||||
keywords: `${org.name}, ${org.description}, courses, learning, education, online learning, edu, online courses, ${org.name} courses`,
|
||||
robots: {
|
||||
index: true,
|
||||
follow: true,
|
||||
nocache: true,
|
||||
googleBot: {
|
||||
index: true,
|
||||
follow: true,
|
||||
"max-image-preview": "large",
|
||||
}
|
||||
},
|
||||
openGraph: {
|
||||
title: "Courses — " + org.name,
|
||||
description: org.description,
|
||||
type: 'website',
|
||||
},
|
||||
};
|
||||
// SEO
|
||||
return {
|
||||
title: 'Courses — ' + org.name,
|
||||
description: org.description,
|
||||
keywords: `${org.name}, ${org.description}, courses, learning, education, online learning, edu, online courses, ${org.name} courses`,
|
||||
robots: {
|
||||
index: true,
|
||||
follow: true,
|
||||
nocache: true,
|
||||
googleBot: {
|
||||
index: true,
|
||||
follow: true,
|
||||
'max-image-preview': 'large',
|
||||
},
|
||||
},
|
||||
openGraph: {
|
||||
title: 'Courses — ' + org.name,
|
||||
description: org.description,
|
||||
type: 'website',
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
async function CoursesPage(params: any) {
|
||||
const orgslug = params.params.orgslug;
|
||||
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] });
|
||||
const cookieStore = cookies();
|
||||
const access_token = await getAccessTokenFromRefreshTokenCookie(cookieStore)
|
||||
const courses = await getOrgCoursesWithAuthHeader(orgslug, { revalidate: 0, tags: ['courses'] }, access_token ? access_token : null);
|
||||
const orgslug = params.params.orgslug
|
||||
const org = await getOrganizationContextInfo(orgslug, {
|
||||
revalidate: 1800,
|
||||
tags: ['organizations'],
|
||||
})
|
||||
const cookieStore = cookies()
|
||||
const access_token = await getAccessTokenFromRefreshTokenCookie(cookieStore)
|
||||
const courses = await getOrgCoursesWithAuthHeader(
|
||||
orgslug,
|
||||
{ revalidate: 0, tags: ['courses'] },
|
||||
access_token ? access_token : null
|
||||
)
|
||||
|
||||
|
||||
return (
|
||||
<CoursesHome org_id={org.org_id} orgslug={orgslug} courses={courses} />
|
||||
)
|
||||
return <CoursesHome org_id={org.org_id} orgslug={orgslug} courses={courses} />
|
||||
}
|
||||
|
||||
export default CoursesPage
|
||||
export default CoursesPage
|
||||
|
|
|
|||
|
|
@ -3,21 +3,25 @@ import LeftMenu from '@components/Dashboard/UI/LeftMenu'
|
|||
import AdminAuthorization from '@components/Security/AdminAuthorization'
|
||||
import React from 'react'
|
||||
|
||||
function DashboardLayout({ children, params }: { children: React.ReactNode, params: any }) {
|
||||
return (
|
||||
<>
|
||||
<SessionProvider>
|
||||
<AdminAuthorization authorizationMode="page">
|
||||
<div className='flex'>
|
||||
<LeftMenu />
|
||||
<div className='flex w-full'>
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
</AdminAuthorization>
|
||||
</SessionProvider>
|
||||
</>
|
||||
)
|
||||
function DashboardLayout({
|
||||
children,
|
||||
params,
|
||||
}: {
|
||||
children: React.ReactNode
|
||||
params: any
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<SessionProvider>
|
||||
<AdminAuthorization authorizationMode="page">
|
||||
<div className="flex">
|
||||
<LeftMenu />
|
||||
<div className="flex w-full">{children}</div>
|
||||
</div>
|
||||
</AdminAuthorization>
|
||||
</SessionProvider>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default DashboardLayout
|
||||
export default DashboardLayout
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
'use client';
|
||||
'use client'
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
|
||||
import { getUriWithOrg } from '@services/config/config'
|
||||
import { Info } from 'lucide-react'
|
||||
|
|
@ -8,44 +8,54 @@ import { motion } from 'framer-motion'
|
|||
import OrgEditGeneral from '@components/Dashboard/Org/OrgEditGeneral/OrgEditGeneral'
|
||||
|
||||
export type OrgParams = {
|
||||
subpage: string
|
||||
orgslug: string
|
||||
subpage: string
|
||||
orgslug: string
|
||||
}
|
||||
|
||||
function OrgPage({ params }: { params: OrgParams }) {
|
||||
return (
|
||||
<div className='h-full w-full bg-[#f8f8f8]'>
|
||||
<div className='pl-10 pr-10 tracking-tight bg-[#fcfbfc] shadow-[0px_4px_16px_rgba(0,0,0,0.02)]'>
|
||||
<BreadCrumbs type='org' ></BreadCrumbs>
|
||||
<div className='my-2 tracking-tighter'>
|
||||
<div className='w-100 flex justify-between'>
|
||||
<div className='pt-3 flex font-bold text-4xl'>Organization Settings</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex space-x-5 font-black text-sm'>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/org/settings/general`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'general' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
</div>
|
||||
return (
|
||||
<div className="h-full w-full bg-[#f8f8f8]">
|
||||
<div className="pl-10 pr-10 tracking-tight bg-[#fcfbfc] shadow-[0px_4px_16px_rgba(0,0,0,0.02)]">
|
||||
<BreadCrumbs type="org"></BreadCrumbs>
|
||||
<div className="my-2 tracking-tighter">
|
||||
<div className="w-100 flex justify-between">
|
||||
<div className="pt-3 flex font-bold text-4xl">
|
||||
Organization Settings
|
||||
</div>
|
||||
<div className='h-6'></div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.10, type: "spring", stiffness: 80 }}
|
||||
>
|
||||
{params.subpage == 'general' ? <OrgEditGeneral /> : ''}
|
||||
</motion.div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
<div className="flex space-x-5 font-black text-sm">
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') + `/dash/org/settings/general`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'general'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="h-6"></div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.1, type: 'spring', stiffness: 80 }}
|
||||
>
|
||||
{params.subpage == 'general' ? <OrgEditGeneral /> : ''}
|
||||
</motion.div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrgPage
|
||||
export default OrgPage
|
||||
|
|
|
|||
|
|
@ -6,59 +6,89 @@ import Link from 'next/link'
|
|||
import AdminAuthorization from '@components/Security/AdminAuthorization'
|
||||
|
||||
function DashboardHome() {
|
||||
return (
|
||||
<div className="flex items-center justify-center mx-auto min-h-screen flex-col space-x-3">
|
||||
<div className='mx-auto pb-10'>
|
||||
<Image alt='learnhouse logo' width={230} src={learnhousetextlogo}></Image>
|
||||
return (
|
||||
<div className="flex items-center justify-center mx-auto min-h-screen flex-col space-x-3">
|
||||
<div className="mx-auto pb-10">
|
||||
<Image
|
||||
alt="learnhouse logo"
|
||||
width={230}
|
||||
src={learnhousetextlogo}
|
||||
></Image>
|
||||
</div>
|
||||
<AdminAuthorization authorizationMode="component">
|
||||
<div className="flex space-x-10">
|
||||
<Link
|
||||
href={`/dash/courses`}
|
||||
className="flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer"
|
||||
>
|
||||
<div className="flex flex-col mx-auto space-y-2">
|
||||
<BookCopy className="mx-auto text-gray-500" size={50}></BookCopy>
|
||||
<div className="text-center font-bold text-gray-500">Courses</div>
|
||||
<p className="text-center text-sm text-gray-400">
|
||||
Create and manage courses, chapters and ativities{' '}
|
||||
</p>
|
||||
</div>
|
||||
<AdminAuthorization authorizationMode="component">
|
||||
<div className='flex space-x-10'>
|
||||
<Link href={`/dash/courses`} className='flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer'>
|
||||
<div className='flex flex-col mx-auto space-y-2'>
|
||||
<BookCopy className='mx-auto text-gray-500' size={50}></BookCopy>
|
||||
<div className='text-center font-bold text-gray-500'>Courses</div>
|
||||
<p className='text-center text-sm text-gray-400'>Create and manage courses, chapters and ativities </p>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={`/dash/org/settings/general`} className='flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer'>
|
||||
<div className='flex flex-col mx-auto space-y-2'>
|
||||
<School className='mx-auto text-gray-500' size={50}></School>
|
||||
<div className='text-center font-bold text-gray-500'>Organization</div>
|
||||
<p className='text-center text-sm text-gray-400'>Configure your Organization general settings </p>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={`/dash/users/settings/users`} className='flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer'>
|
||||
<div className='flex flex-col mx-auto space-y-2'>
|
||||
<Users className='mx-auto text-gray-500' size={50}></Users>
|
||||
<div className='text-center font-bold text-gray-500'>Users</div>
|
||||
<p className='text-center text-sm text-gray-400'>Manage your Organization's users, roles </p>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
</div>
|
||||
</AdminAuthorization>
|
||||
<div className='flex flex-col space-y-10 '>
|
||||
<AdminAuthorization authorizationMode="component">
|
||||
<div className='h-1 w-[100px] bg-neutral-200 rounded-full mx-auto'></div>
|
||||
<div className="flex justify-center items-center">
|
||||
<Link href={'https://learn.learnhouse.io/'} className='flex mt-[40px] bg-black space-x-2 items-center py-3 px-7 rounded-lg shadow-lg hover:scale-105 transition-all ease-linear cursor-pointer'>
|
||||
<BookCopy className=' text-gray-100' size={20}></BookCopy>
|
||||
<div className=' text-sm font-bold text-gray-100'>Learn LearnHouse</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className='mx-auto mt-[40px] w-28 h-1 bg-neutral-200 rounded-full'></div>
|
||||
</AdminAuthorization>
|
||||
|
||||
<Link href={'/dash/user-account/settings/general'} className='flex bg-white shadow-lg p-[15px] items-center rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer'>
|
||||
<div className='flex flex-row mx-auto space-x-3 items-center'>
|
||||
<Settings className=' text-gray-500' size={20}></Settings>
|
||||
<div className=' font-bold text-gray-500'>Account Settings</div>
|
||||
<p className=' text-sm text-gray-400'>Configure your personal settings, passwords, email</p>
|
||||
</div>
|
||||
</Link>
|
||||
</Link>
|
||||
<Link
|
||||
href={`/dash/org/settings/general`}
|
||||
className="flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer"
|
||||
>
|
||||
<div className="flex flex-col mx-auto space-y-2">
|
||||
<School className="mx-auto text-gray-500" size={50}></School>
|
||||
<div className="text-center font-bold text-gray-500">
|
||||
Organization
|
||||
</div>
|
||||
<p className="text-center text-sm text-gray-400">
|
||||
Configure your Organization general settings{' '}
|
||||
</p>
|
||||
</div>
|
||||
</Link>
|
||||
<Link
|
||||
href={`/dash/users/settings/users`}
|
||||
className="flex bg-white shadow-lg p-[35px] w-[250px] rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer"
|
||||
>
|
||||
<div className="flex flex-col mx-auto space-y-2">
|
||||
<Users className="mx-auto text-gray-500" size={50}></Users>
|
||||
<div className="text-center font-bold text-gray-500">Users</div>
|
||||
<p className="text-center text-sm text-gray-400">
|
||||
Manage your Organization's users, roles{' '}
|
||||
</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
</AdminAuthorization>
|
||||
<div className="flex flex-col space-y-10 ">
|
||||
<AdminAuthorization authorizationMode="component">
|
||||
<div className="h-1 w-[100px] bg-neutral-200 rounded-full mx-auto"></div>
|
||||
<div className="flex justify-center items-center">
|
||||
<Link
|
||||
href={'https://learn.learnhouse.io/'}
|
||||
className="flex mt-[40px] bg-black space-x-2 items-center py-3 px-7 rounded-lg shadow-lg hover:scale-105 transition-all ease-linear cursor-pointer"
|
||||
>
|
||||
<BookCopy className=" text-gray-100" size={20}></BookCopy>
|
||||
<div className=" text-sm font-bold text-gray-100">
|
||||
Learn LearnHouse
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="mx-auto mt-[40px] w-28 h-1 bg-neutral-200 rounded-full"></div>
|
||||
</AdminAuthorization>
|
||||
|
||||
<Link
|
||||
href={'/dash/user-account/settings/general'}
|
||||
className="flex bg-white shadow-lg p-[15px] items-center rounded-lg items-center mx-auto hover:scale-105 transition-all ease-linear cursor-pointer"
|
||||
>
|
||||
<div className="flex flex-row mx-auto space-x-3 items-center">
|
||||
<Settings className=" text-gray-500" size={20}></Settings>
|
||||
<div className=" font-bold text-gray-500">Account Settings</div>
|
||||
<p className=" text-sm text-gray-400">
|
||||
Configure your personal settings, passwords, email
|
||||
</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default DashboardHome
|
||||
export default DashboardHome
|
||||
|
|
|
|||
|
|
@ -1,70 +1,90 @@
|
|||
'use client';
|
||||
'use client'
|
||||
import React, { useEffect } from 'react'
|
||||
import { motion } from 'framer-motion';
|
||||
import UserEditGeneral from '@components/Dashboard/UserAccount/UserEditGeneral/UserEditGeneral';
|
||||
import UserEditPassword from '@components/Dashboard/UserAccount/UserEditPassword/UserEditPassword';
|
||||
import Link from 'next/link';
|
||||
import { getUriWithOrg } from '@services/config/config';
|
||||
import { Info, Lock } from 'lucide-react';
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs';
|
||||
import { useSession } from '@components/Contexts/SessionContext';
|
||||
import { motion } from 'framer-motion'
|
||||
import UserEditGeneral from '@components/Dashboard/UserAccount/UserEditGeneral/UserEditGeneral'
|
||||
import UserEditPassword from '@components/Dashboard/UserAccount/UserEditPassword/UserEditPassword'
|
||||
import Link from 'next/link'
|
||||
import { getUriWithOrg } from '@services/config/config'
|
||||
import { Info, Lock } from 'lucide-react'
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
|
||||
import { useSession } from '@components/Contexts/SessionContext'
|
||||
|
||||
export type SettingsParams = {
|
||||
subpage: string
|
||||
orgslug: string
|
||||
subpage: string
|
||||
orgslug: string
|
||||
}
|
||||
|
||||
function SettingsPage({ params }: { params: SettingsParams }) {
|
||||
const session = useSession() as any;
|
||||
const session = useSession() as any
|
||||
|
||||
useEffect(() => {}, [session])
|
||||
|
||||
useEffect(() => {
|
||||
}
|
||||
, [session])
|
||||
|
||||
return (
|
||||
<div className='h-full w-full bg-[#f8f8f8]'>
|
||||
<div className='pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]'>
|
||||
<BreadCrumbs type='user' last_breadcrumb={session?.user?.username} ></BreadCrumbs>
|
||||
<div className='my-2 tracking-tighter'>
|
||||
<div className='w-100 flex justify-between'>
|
||||
<div className='pt-3 flex font-bold text-4xl'>Account Settings</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex space-x-5 font-black text-sm'>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/user-account/settings/general`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'general' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/user-account/settings/security`}>
|
||||
<div className={`flex space-x-4 py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'security' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<Lock size={16} />
|
||||
<div>Password</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-6'></div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.10, type: "spring", stiffness: 80 }}
|
||||
className='h-full overflow-y-auto'
|
||||
>
|
||||
{params.subpage == 'general' ? <UserEditGeneral /> : ''}
|
||||
{params.subpage == 'security' ? <UserEditPassword /> : ''}
|
||||
</motion.div>
|
||||
return (
|
||||
<div className="h-full w-full bg-[#f8f8f8]">
|
||||
<div className="pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]">
|
||||
<BreadCrumbs
|
||||
type="user"
|
||||
last_breadcrumb={session?.user?.username}
|
||||
></BreadCrumbs>
|
||||
<div className="my-2 tracking-tighter">
|
||||
<div className="w-100 flex justify-between">
|
||||
<div className="pt-3 flex font-bold text-4xl">Account Settings</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
<div className="flex space-x-5 font-black text-sm">
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') +
|
||||
`/dash/user-account/settings/general`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'general'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<Info size={16} />
|
||||
<div>General</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') +
|
||||
`/dash/user-account/settings/security`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`flex space-x-4 py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'security'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<Lock size={16} />
|
||||
<div>Password</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="h-6"></div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.1, type: 'spring', stiffness: 80 }}
|
||||
className="h-full overflow-y-auto"
|
||||
>
|
||||
{params.subpage == 'general' ? <UserEditGeneral /> : ''}
|
||||
{params.subpage == 'security' ? <UserEditPassword /> : ''}
|
||||
</motion.div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SettingsPage
|
||||
export default SettingsPage
|
||||
|
|
|
|||
|
|
@ -1,101 +1,128 @@
|
|||
'use client';
|
||||
'use client'
|
||||
import React, { useEffect } from 'react'
|
||||
import { motion } from 'framer-motion';
|
||||
import Link from 'next/link';
|
||||
import { getUriWithOrg } from '@services/config/config';
|
||||
import { ScanEye, UserPlus, Users } from 'lucide-react';
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs';
|
||||
import { useSession } from '@components/Contexts/SessionContext';
|
||||
import { useOrg } from '@components/Contexts/OrgContext';
|
||||
import OrgUsers from '@components/Dashboard/Users/OrgUsers/OrgUsers';
|
||||
import OrgAccess from '@components/Dashboard/Users/OrgAccess/OrgAccess';
|
||||
import { motion } from 'framer-motion'
|
||||
import Link from 'next/link'
|
||||
import { getUriWithOrg } from '@services/config/config'
|
||||
import { ScanEye, UserPlus, Users } from 'lucide-react'
|
||||
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
|
||||
import { useSession } from '@components/Contexts/SessionContext'
|
||||
import { useOrg } from '@components/Contexts/OrgContext'
|
||||
import OrgUsers from '@components/Dashboard/Users/OrgUsers/OrgUsers'
|
||||
import OrgAccess from '@components/Dashboard/Users/OrgAccess/OrgAccess'
|
||||
|
||||
export type SettingsParams = {
|
||||
subpage: string
|
||||
orgslug: string
|
||||
subpage: string
|
||||
orgslug: string
|
||||
}
|
||||
|
||||
function UsersSettingsPage({ params }: { params: SettingsParams }) {
|
||||
const session = useSession() as any;
|
||||
const org = useOrg() as any;
|
||||
const [H1Label, setH1Label] = React.useState('')
|
||||
const [H2Label, setH2Label] = React.useState('')
|
||||
const session = useSession() as any
|
||||
const org = useOrg() as any
|
||||
const [H1Label, setH1Label] = React.useState('')
|
||||
const [H2Label, setH2Label] = React.useState('')
|
||||
|
||||
function handleLabels() {
|
||||
if (params.subpage == 'users') {
|
||||
setH1Label('Users')
|
||||
setH2Label('Manage your organization users, assign roles and permissions')
|
||||
}
|
||||
if (params.subpage == 'signups') {
|
||||
setH1Label('Signup Access')
|
||||
setH2Label('Choose from where users can join your organization')
|
||||
}
|
||||
if (params.subpage == 'add') {
|
||||
setH1Label('Invite users')
|
||||
setH2Label('Invite users to join your organization')
|
||||
}
|
||||
function handleLabels() {
|
||||
if (params.subpage == 'users') {
|
||||
setH1Label('Users')
|
||||
setH2Label('Manage your organization users, assign roles and permissions')
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
handleLabels()
|
||||
if (params.subpage == 'signups') {
|
||||
setH1Label('Signup Access')
|
||||
setH2Label('Choose from where users can join your organization')
|
||||
}
|
||||
, [session, org, params.subpage, params])
|
||||
if (params.subpage == 'add') {
|
||||
setH1Label('Invite users')
|
||||
setH2Label('Invite users to join your organization')
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='h-screen w-full bg-[#f8f8f8] grid grid-rows-[auto,1fr]'>
|
||||
<div className='pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]'>
|
||||
<BreadCrumbs type='orgusers' ></BreadCrumbs>
|
||||
<div className='my-2 py-3'>
|
||||
<div className='w-100 flex flex-col space-y-1'>
|
||||
<div className='pt-3 flex font-bold text-4xl tracking-tighter'>{H1Label}</div>
|
||||
<div className='flex font-medium text-gray-400 text-md'>{H2Label} </div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex space-x-5 font-black text-sm'>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/users/settings/users`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'users' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
useEffect(() => {
|
||||
handleLabels()
|
||||
}, [session, org, params.subpage, params])
|
||||
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<Users size={16} />
|
||||
<div>Users</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/users/settings/add`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'add' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<UserPlus size={16} />
|
||||
<div>Invite users</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href={getUriWithOrg(params.orgslug, "") + `/dash/users/settings/signups`}>
|
||||
<div className={`py-2 w-fit text-center border-black transition-all ease-linear ${params.subpage.toString() === 'signups' ? 'border-b-4' : 'opacity-50'} cursor-pointer`}>
|
||||
<div className='flex items-center space-x-2.5 mx-2'>
|
||||
<ScanEye size={16} />
|
||||
<div>Signup Access</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
</div>
|
||||
return (
|
||||
<div className="h-screen w-full bg-[#f8f8f8] grid grid-rows-[auto,1fr]">
|
||||
<div className="pl-10 pr-10 tracking-tight bg-[#fcfbfc] z-10 shadow-[0px_4px_16px_rgba(0,0,0,0.06)]">
|
||||
<BreadCrumbs type="orgusers"></BreadCrumbs>
|
||||
<div className="my-2 py-3">
|
||||
<div className="w-100 flex flex-col space-y-1">
|
||||
<div className="pt-3 flex font-bold text-4xl tracking-tighter">
|
||||
{H1Label}
|
||||
</div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.10, type: "spring", stiffness: 80 }}
|
||||
className='h-full overflow-y-auto'
|
||||
>
|
||||
{params.subpage == 'users' ? <OrgUsers /> : ''}
|
||||
{params.subpage == 'signups' ? <OrgAccess /> : ''}
|
||||
</motion.div>
|
||||
<div className="flex font-medium text-gray-400 text-md">
|
||||
{H2Label}{' '}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
<div className="flex space-x-5 font-black text-sm">
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') + `/dash/users/settings/users`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'users'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<Users size={16} />
|
||||
<div>Users</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') + `/dash/users/settings/add`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'add'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<UserPlus size={16} />
|
||||
<div>Invite users</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link
|
||||
href={
|
||||
getUriWithOrg(params.orgslug, '') + `/dash/users/settings/signups`
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={`py-2 w-fit text-center border-black transition-all ease-linear ${
|
||||
params.subpage.toString() === 'signups'
|
||||
? 'border-b-4'
|
||||
: 'opacity-50'
|
||||
} cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-center space-x-2.5 mx-2">
|
||||
<ScanEye size={16} />
|
||||
<div>Signup Access</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0 }}
|
||||
transition={{ duration: 0.1, type: 'spring', stiffness: 80 }}
|
||||
className="h-full overflow-y-auto"
|
||||
>
|
||||
{params.subpage == 'users' ? <OrgUsers /> : ''}
|
||||
{params.subpage == 'signups' ? <OrgAccess /> : ''}
|
||||
</motion.div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default UsersSettingsPage
|
||||
export default UsersSettingsPage
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue