mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: migrate rest of settings to serv comps
This commit is contained in:
swve
parent
23d5a80966
commit
21171976b4
4 changed files with 202 additions and 146 deletions
|
|
@ -1,76 +1,29 @@
|
|||
"use client";
|
||||
import { AuthContext } from '@components/Security/AuthProvider';
|
||||
import React, { useEffect } from 'react'
|
||||
import { Formik, Form, Field, ErrorMessage } from 'formik';
|
||||
import { updateProfile } from '@services/settings/profile';
|
||||
import { updatePassword } from '@services/settings/password';
|
||||
import { getOrganizationContextInfo } from "@services/organizations/orgs";
|
||||
import { Metadata } from "next";
|
||||
import PasswordsClient from "./passwords";
|
||||
|
||||
function SettingsProfilePasswordsPage() {
|
||||
type MetadataProps = {
|
||||
params: { orgslug: string };
|
||||
searchParams: { [key: string]: string | string[] | undefined };
|
||||
};
|
||||
|
||||
const auth: any = React.useContext(AuthContext);
|
||||
export async function generateMetadata(
|
||||
{ params }: MetadataProps,
|
||||
): Promise<Metadata> {
|
||||
|
||||
const updatePasswordUI = async (values: any) => {
|
||||
let user_id = auth.userInfo.user_object.user_id;
|
||||
console.log(values);
|
||||
await updatePassword(user_id, values)
|
||||
// Get Org context information
|
||||
const org = await getOrganizationContextInfo(params.orgslug, { revalidate: 1800, tags: ['organizations'] });
|
||||
return {
|
||||
title: `Settings: Passwords — ${org.name}`,
|
||||
description: org.description,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
function SettingsProfilePasswordsPage() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
{auth.isAuthenticated && (
|
||||
<div>
|
||||
<h1 className='text-3xl font-bold'>Account Password</h1>
|
||||
<br /><br />
|
||||
|
||||
<Formik
|
||||
initialValues={{ old_password: '', new_password: '' }}
|
||||
onSubmit={(values, { setSubmitting }) => {
|
||||
setTimeout(() => {
|
||||
alert(JSON.stringify(values, null, 2));
|
||||
setSubmitting(false);
|
||||
updatePasswordUI(values)
|
||||
}, 400);
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form className="max-w-md">
|
||||
<label className="block mb-2 font-bold" htmlFor="old_password">
|
||||
Old Password
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="password"
|
||||
name="old_password"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="new_password">
|
||||
New Password
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="password"
|
||||
name="new_password"
|
||||
/>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-3 text-white bg-black rounded-lg shadow-md hover:bg-black focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</Form>
|
||||
|
||||
)}
|
||||
</Formik>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<>
|
||||
<PasswordsClient></PasswordsClient>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,77 @@
|
|||
"use client";
|
||||
import { AuthContext } from '@components/Security/AuthProvider';
|
||||
import React, { useEffect } from 'react'
|
||||
import { Formik, Form, Field, ErrorMessage } from 'formik';
|
||||
import { updatePassword } from '@services/settings/password';
|
||||
|
||||
|
||||
function PasswordsClient() {
|
||||
const auth: any = React.useContext(AuthContext);
|
||||
|
||||
console.log('auth', auth)
|
||||
|
||||
const updatePasswordUI = async (values: any) => {
|
||||
let user_id = auth.userInfo.user_object.user_id;
|
||||
await updatePassword(user_id, values)
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
{auth.isAuthenticated && (
|
||||
<div>
|
||||
<h1 className='text-3xl font-bold'>Account Password</h1>
|
||||
<br /><br />
|
||||
|
||||
<Formik
|
||||
initialValues={{ old_password: '', new_password: '' }}
|
||||
onSubmit={(values, { setSubmitting }) => {
|
||||
setTimeout(() => {
|
||||
alert(JSON.stringify(values, null, 2));
|
||||
setSubmitting(false);
|
||||
updatePasswordUI(values)
|
||||
}, 400);
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form className="max-w-md">
|
||||
<label className="block mb-2 font-bold" htmlFor="old_password">
|
||||
Old Password
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="password"
|
||||
name="old_password"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="new_password">
|
||||
New Password
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="password"
|
||||
name="new_password"
|
||||
/>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-3 text-white bg-black rounded-lg shadow-md hover:bg-black focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</Form>
|
||||
|
||||
)}
|
||||
</Formik>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default PasswordsClient
|
||||
|
|
@ -1,79 +1,26 @@
|
|||
"use client";
|
||||
import { AuthContext } from '@components/Security/AuthProvider';
|
||||
import React, { useEffect } from 'react'
|
||||
import { Formik, Form, Field, ErrorMessage } from 'formik';
|
||||
import { updateProfile } from '@services/settings/profile';
|
||||
import { getOrganizationContextInfo } from "@services/organizations/orgs";
|
||||
import { Metadata } from "next";
|
||||
import ProfileClient from "./profile";
|
||||
|
||||
type MetadataProps = {
|
||||
params: { orgslug: string };
|
||||
searchParams: { [key: string]: string | string[] | undefined };
|
||||
};
|
||||
|
||||
export async function generateMetadata(
|
||||
{ params }: MetadataProps,
|
||||
): Promise<Metadata> {
|
||||
|
||||
// Get Org context information
|
||||
const org = await getOrganizationContextInfo(params.orgslug, { revalidate: 1800, tags: ['organizations'] });
|
||||
return {
|
||||
title: `Settings: Profile — ${org.name}`,
|
||||
description: org.description,
|
||||
};
|
||||
}
|
||||
|
||||
function SettingsProfilePage() {
|
||||
const auth: any = React.useContext(AuthContext);
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
{auth.isAuthenticated && (
|
||||
<div>
|
||||
<h1 className='text-3xl font-bold'>Profile Settings</h1>
|
||||
<br /><br />
|
||||
|
||||
<Formik
|
||||
initialValues={auth.userInfo.user_object}
|
||||
|
||||
onSubmit={(values, { setSubmitting }) => {
|
||||
setTimeout(() => {
|
||||
alert(JSON.stringify(values, null, 2));
|
||||
setSubmitting(false);
|
||||
updateProfile(values)
|
||||
}, 400);
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form className="max-w-md">
|
||||
<label className="block mb-2 font-bold" htmlFor="full_name">
|
||||
Full Name
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="textarea"
|
||||
name="full_name"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="email">
|
||||
Email
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="email"
|
||||
name="email"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="bio">
|
||||
Bio
|
||||
</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"
|
||||
type="textarea"
|
||||
name="bio"
|
||||
/>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-3 text-white bg-black rounded-lg shadow-md hover:bg-black focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</Form>
|
||||
|
||||
)}
|
||||
</Formik>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
)
|
||||
return <ProfileClient></ProfileClient>
|
||||
}
|
||||
|
||||
export default SettingsProfilePage
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
"use client";
|
||||
import { AuthContext } from '@components/Security/AuthProvider';
|
||||
import React, { useEffect } from 'react'
|
||||
import { Formik, Form, Field, ErrorMessage } from 'formik';
|
||||
import { updateProfile } from '@services/settings/profile';
|
||||
|
||||
function ProfileClient() {
|
||||
const auth: any = React.useContext(AuthContext);
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
{auth.isAuthenticated && (
|
||||
<div>
|
||||
<h1 className='text-3xl font-bold'>Profile Settings</h1>
|
||||
<br /><br />
|
||||
|
||||
<Formik
|
||||
initialValues={auth.userInfo.user_object}
|
||||
|
||||
onSubmit={(values, { setSubmitting }) => {
|
||||
setTimeout(() => {
|
||||
alert(JSON.stringify(values, null, 2));
|
||||
setSubmitting(false);
|
||||
updateProfile(values)
|
||||
}, 400);
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form className="max-w-md">
|
||||
<label className="block mb-2 font-bold" htmlFor="full_name">
|
||||
Full Name
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="textarea"
|
||||
name="full_name"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="email">
|
||||
Email
|
||||
</label>
|
||||
<Field
|
||||
className="w-full px-4 py-2 mb-4 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
type="email"
|
||||
name="email"
|
||||
/>
|
||||
|
||||
<label className="block mb-2 font-bold" htmlFor="bio">
|
||||
Bio
|
||||
</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"
|
||||
type="textarea"
|
||||
name="bio"
|
||||
/>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-3 text-white bg-black rounded-lg shadow-md hover:bg-black focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</Form>
|
||||
|
||||
)}
|
||||
</Formik>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ProfileClient
|
||||
Loading…
Add table
Add a link
Reference in a new issue