feat: init user settings

This commit is contained in:
swve 2023-12-13 21:30:47 +01:00
parent 6fea7ec1af
commit 838a94eec1
17 changed files with 273 additions and 40 deletions

View file

@ -1,5 +1,5 @@
'use client';
import EditCourseStructure from '../../../../../../../../components/Dashboard/EditCourseStructure/EditCourseStructure'
import EditCourseStructure from '../../../../../../../../components/Dashboard/Course/EditCourseStructure/EditCourseStructure'
import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
import PageLoading from '@components/Objects/Loaders/PageLoading';
import ClientComponentSkeleton from '@components/Utils/ClientComp';
@ -13,7 +13,7 @@ import Link from 'next/link';
import { CourseOverviewTop } from '@components/Dashboard/UI/CourseOverviewTop';
import { CSSTransition } from 'react-transition-group';
import { motion } from 'framer-motion';
import EditCourseGeneral from '@components/Dashboard/EditCourseGeneral/EditCourseGeneral';
import EditCourseGeneral from '@components/Dashboard/Course/EditCourseGeneral/EditCourseGeneral';
import { GalleryVertical, GalleryVerticalEnd, Info } from 'lucide-react';
export type CourseOverviewParams = {
@ -33,7 +33,6 @@ function CourseOverviewPage({ params }: { params: CourseOverviewParams }) {
return (
<div className='h-full w-full bg-[#f8f8f8]'>
<CourseProvider courseuuid={getEntireCourseUUID(params.courseuuid)}>
<div className='pl-10 pr-10 tracking-tight bg-[#fcfbfc] shadow-[0px_4px_16px_rgba(0,0,0,0.02)]'>
<CourseOverviewTop params={params} />

View file

@ -1,8 +1,12 @@
import PageLoading from '@components/Objects/Loaders/PageLoading'
import React from 'react'
function DashboardHome() {
return (
<div>DashboardHome</div>
<div className="flex items-center justify-center mx-auto min-h-screen flex-col space-x-3">
<PageLoading />
<div className='text-neutral-400 font-bold animate-pulse text-2xl'>This page is work in progress</div>
</div>
)
}

View file

@ -0,0 +1,69 @@
'use client';
import React, { useEffect } from 'react'
import { motion } from 'framer-motion';
import UserEditGeneral from '@components/Dashboard/User/UserEditGeneral/UserEditGeneral';
import UserEditPassword from '@components/Dashboard/User/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 { useAuth } from '@components/Security/AuthContext';
export type SettingsParams = {
subpage: string
orgslug: string
}
function SettingsPage({ params }: { params: SettingsParams }) {
const auth = useAuth() as any;
useEffect(() => {
}
, [auth])
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='user' last_breadcrumb={auth?.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/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/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 }}
>
{params.subpage == 'general' ? <UserEditGeneral /> : ''}
{params.subpage == 'security' ? <UserEditPassword /> : ''}
</motion.div>
</div>
)
}
export default SettingsPage

View file

@ -6,6 +6,8 @@ import { updateProfile } from '@services/settings/profile';
function ProfileClient() {
const auth: any = React.useContext(AuthContext);
return (
<div>
@ -51,7 +53,7 @@ function ProfileClient() {
</label>
<Field
as="textarea"
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
className="w-full h-64 px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
type="textarea"
name="bio"
/>