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,131 +1,178 @@
|
|||
"use client";
|
||||
import FormLayout, { ButtonBlack, FormField, FormLabelAndMessage, Input } from '@components/StyledElements/Form/Form'
|
||||
import * as Form from '@radix-ui/react-form';
|
||||
import { getAPIUrl } from '@services/config/config';
|
||||
import { createNewUserInstall, updateInstall } from '@services/install/install';
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { useFormik } from 'formik';
|
||||
import { useRouter } from 'next/navigation';
|
||||
'use client'
|
||||
import FormLayout, {
|
||||
ButtonBlack,
|
||||
FormField,
|
||||
FormLabelAndMessage,
|
||||
Input,
|
||||
} from '@components/StyledElements/Form/Form'
|
||||
import * as Form from '@radix-ui/react-form'
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import { createNewUserInstall, updateInstall } from '@services/install/install'
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { useFormik } from 'formik'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import React from 'react'
|
||||
import { BarLoader } from 'react-spinners';
|
||||
import useSWR from "swr";
|
||||
import { BarLoader } from 'react-spinners'
|
||||
import useSWR from 'swr'
|
||||
|
||||
const validate = (values: any) => {
|
||||
const errors: any = {};
|
||||
const errors: any = {}
|
||||
|
||||
if (!values.email) {
|
||||
errors.email = 'Required';
|
||||
}
|
||||
else if (
|
||||
!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)
|
||||
) {
|
||||
errors.email = 'Invalid email address';
|
||||
}
|
||||
if (!values.email) {
|
||||
errors.email = 'Required'
|
||||
} else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)) {
|
||||
errors.email = 'Invalid email address'
|
||||
}
|
||||
|
||||
if (!values.password) {
|
||||
errors.password = 'Required';
|
||||
}
|
||||
else if (values.password.length < 8) {
|
||||
errors.password = 'Password must be at least 8 characters';
|
||||
}
|
||||
if (!values.password) {
|
||||
errors.password = 'Required'
|
||||
} else if (values.password.length < 8) {
|
||||
errors.password = 'Password must be at least 8 characters'
|
||||
}
|
||||
|
||||
if (!values.confirmPassword) {
|
||||
errors.confirmPassword = 'Required';
|
||||
}
|
||||
else if (values.confirmPassword !== values.password) {
|
||||
errors.confirmPassword = 'Passwords must match';
|
||||
}
|
||||
if (!values.confirmPassword) {
|
||||
errors.confirmPassword = 'Required'
|
||||
} else if (values.confirmPassword !== values.password) {
|
||||
errors.confirmPassword = 'Passwords must match'
|
||||
}
|
||||
|
||||
if (!values.username) {
|
||||
errors.username = 'Required';
|
||||
}
|
||||
else if (values.username.length < 3) {
|
||||
errors.username = 'Username must be at least 3 characters';
|
||||
}
|
||||
if (!values.username) {
|
||||
errors.username = 'Required'
|
||||
} else if (values.username.length < 3) {
|
||||
errors.username = 'Username must be at least 3 characters'
|
||||
}
|
||||
|
||||
return errors;
|
||||
};
|
||||
|
||||
function AccountCreation() {
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false);
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const router = useRouter(
|
||||
|
||||
)
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
org_slug: '',
|
||||
email: '',
|
||||
password: '',
|
||||
confirmPassword: '',
|
||||
username: '',
|
||||
},
|
||||
validate,
|
||||
onSubmit: async values => {
|
||||
|
||||
let finalvalueswithoutpasswords = { ...values, password: '', confirmPassword: '', org_slug: install.data[1].slug }
|
||||
let install_data_without_passwords = { ...install.data, 3: finalvalueswithoutpasswords }
|
||||
await updateInstall({ ...install_data_without_passwords }, 4)
|
||||
await createNewUserInstall({email:values.email,username:values.username,password:values.password},install.data[1].slug)
|
||||
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
|
||||
router.push('/install?step=4')
|
||||
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<div>
|
||||
<FormLayout onSubmit={formik.handleSubmit}>
|
||||
<FormField name="email">
|
||||
<FormLabelAndMessage label='Email' message={formik.errors.email} />
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.email} type="email" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for password */}
|
||||
<FormField name="password">
|
||||
<FormLabelAndMessage label='Password' message={formik.errors.password} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.password} type="password" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for confirm password */}
|
||||
<FormField name="confirmPassword">
|
||||
|
||||
<FormLabelAndMessage label='Confirm Password' message={formik.errors.confirmPassword} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.confirmPassword} type="password" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for username */}
|
||||
<FormField name="username">
|
||||
|
||||
<FormLabelAndMessage label='Username' message={formik.errors.username} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.username} type="text" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<div className="flex flex-row-reverse py-4">
|
||||
<Form.Submit asChild>
|
||||
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
|
||||
{isSubmitting ? <BarLoader cssOverride={{ borderRadius: 60, }} width={60} color="#ffffff" />
|
||||
: "Create Admin Account"}
|
||||
</ButtonBlack>
|
||||
</Form.Submit>
|
||||
</div>
|
||||
|
||||
</FormLayout>
|
||||
</div>
|
||||
)
|
||||
return errors
|
||||
}
|
||||
|
||||
export default AccountCreation
|
||||
function AccountCreation() {
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false)
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const router = useRouter()
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
org_slug: '',
|
||||
email: '',
|
||||
password: '',
|
||||
confirmPassword: '',
|
||||
username: '',
|
||||
},
|
||||
validate,
|
||||
onSubmit: async (values) => {
|
||||
let finalvalueswithoutpasswords = {
|
||||
...values,
|
||||
password: '',
|
||||
confirmPassword: '',
|
||||
org_slug: install.data[1].slug,
|
||||
}
|
||||
let install_data_without_passwords = {
|
||||
...install.data,
|
||||
3: finalvalueswithoutpasswords,
|
||||
}
|
||||
await updateInstall({ ...install_data_without_passwords }, 4)
|
||||
await createNewUserInstall(
|
||||
{
|
||||
email: values.email,
|
||||
username: values.username,
|
||||
password: values.password,
|
||||
},
|
||||
install.data[1].slug
|
||||
)
|
||||
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
|
||||
router.push('/install?step=4')
|
||||
},
|
||||
})
|
||||
|
||||
return (
|
||||
<div>
|
||||
<FormLayout onSubmit={formik.handleSubmit}>
|
||||
<FormField name="email">
|
||||
<FormLabelAndMessage label="Email" message={formik.errors.email} />
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.email}
|
||||
type="email"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for password */}
|
||||
<FormField name="password">
|
||||
<FormLabelAndMessage
|
||||
label="Password"
|
||||
message={formik.errors.password}
|
||||
/>
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.password}
|
||||
type="password"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for confirm password */}
|
||||
<FormField name="confirmPassword">
|
||||
<FormLabelAndMessage
|
||||
label="Confirm Password"
|
||||
message={formik.errors.confirmPassword}
|
||||
/>
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.confirmPassword}
|
||||
type="password"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for username */}
|
||||
<FormField name="username">
|
||||
<FormLabelAndMessage
|
||||
label="Username"
|
||||
message={formik.errors.username}
|
||||
/>
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.username}
|
||||
type="text"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<div className="flex flex-row-reverse py-4">
|
||||
<Form.Submit asChild>
|
||||
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
|
||||
{isSubmitting ? (
|
||||
<BarLoader
|
||||
cssOverride={{ borderRadius: 60 }}
|
||||
width={60}
|
||||
color="#ffffff"
|
||||
/>
|
||||
) : (
|
||||
'Create Admin Account'
|
||||
)}
|
||||
</ButtonBlack>
|
||||
</Form.Submit>
|
||||
</div>
|
||||
</FormLayout>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default AccountCreation
|
||||
|
|
|
|||
|
|
@ -1,45 +1,49 @@
|
|||
import { getAPIUrl } from '@services/config/config';
|
||||
import { createDefaultElements, updateInstall } from '@services/install/install';
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import { createDefaultElements, updateInstall } from '@services/install/install'
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import React from 'react'
|
||||
import useSWR from "swr";
|
||||
import useSWR from 'swr'
|
||||
|
||||
function DefaultElements() {
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false);
|
||||
const [isSubmitted, setIsSubmitted] = React.useState(false);
|
||||
const router = useRouter()
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false)
|
||||
const [isSubmitted, setIsSubmitted] = React.useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
function createDefElementsAndUpdateInstall() {
|
||||
try {
|
||||
createDefaultElements()
|
||||
// add an {} to the install.data object
|
||||
function createDefElementsAndUpdateInstall() {
|
||||
try {
|
||||
createDefaultElements()
|
||||
// add an {} to the install.data object
|
||||
|
||||
let install_data = { ...install.data, 2: { status: 'OK' } }
|
||||
|
||||
updateInstall(install_data, 3)
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
let install_data = { ...install.data, 2: { status: 'OK' } }
|
||||
|
||||
router.push('/install?step=3')
|
||||
setIsSubmitted(true)
|
||||
}
|
||||
catch (e) {
|
||||
|
||||
}
|
||||
}
|
||||
updateInstall(install_data, 3)
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
|
||||
return (
|
||||
<div className='flex py-10 justify-center items-center space-x-3'>
|
||||
<h1>Install Default Elements </h1>
|
||||
<div onClick={createDefElementsAndUpdateInstall} className='p-3 font-bold bg-gray-200 text-gray-900 rounded-lg hover:cursor-pointer' >
|
||||
Install
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
router.push('/install?step=3')
|
||||
setIsSubmitted(true)
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex py-10 justify-center items-center space-x-3">
|
||||
<h1>Install Default Elements </h1>
|
||||
<div
|
||||
onClick={createDefElementsAndUpdateInstall}
|
||||
className="p-3 font-bold bg-gray-200 text-gray-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Install
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default DefaultElements
|
||||
export default DefaultElements
|
||||
|
|
|
|||
|
|
@ -2,18 +2,32 @@ import { Check, Link } from 'lucide-react'
|
|||
import React from 'react'
|
||||
|
||||
function DisableInstallMode() {
|
||||
return (
|
||||
<div className='p-4 bg-green-300 text-green-950 rounded-md flex space-x-4 items-center'>
|
||||
<div>
|
||||
<Check size={32} />
|
||||
</div>
|
||||
<div><p className='font-bold text-lg'>You have reached the end of the Installation process, <b><i>please don't forget to disable installation mode.</i></b> </p>
|
||||
<div className='flex space-x-2 items-center'>
|
||||
<Link size={20} />
|
||||
<a rel='noreferrer' target='_blank' className="text-blue-950 font-medium" href="http://docs.learnhouse.app">LearnHouse Docs</a>
|
||||
</div></div>
|
||||
return (
|
||||
<div className="p-4 bg-green-300 text-green-950 rounded-md flex space-x-4 items-center">
|
||||
<div>
|
||||
<Check size={32} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-bold text-lg">
|
||||
You have reached the end of the Installation process,{' '}
|
||||
<b>
|
||||
<i>please don't forget to disable installation mode.</i>
|
||||
</b>{' '}
|
||||
</p>
|
||||
<div className="flex space-x-2 items-center">
|
||||
<Link size={20} />
|
||||
<a
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
className="text-blue-950 font-medium"
|
||||
href="http://docs.learnhouse.app"
|
||||
>
|
||||
LearnHouse Docs
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default DisableInstallMode
|
||||
export default DisableInstallMode
|
||||
|
|
|
|||
|
|
@ -1,39 +1,42 @@
|
|||
import { getAPIUrl } from '@services/config/config';
|
||||
import { updateInstall } from '@services/install/install';
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import { updateInstall } from '@services/install/install'
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { Check } from 'lucide-react'
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useRouter } from 'next/navigation'
|
||||
import React from 'react'
|
||||
import useSWR from "swr";
|
||||
import useSWR from 'swr'
|
||||
|
||||
const Finish = () => {
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const router = useRouter()
|
||||
|
||||
async function finishInstall() {
|
||||
|
||||
let install_data = { ...install.data, 5: { status: 'OK' } }
|
||||
|
||||
let data = await updateInstall(install_data, 6)
|
||||
if (data) {
|
||||
router.push('/install?step=6')
|
||||
}
|
||||
else {
|
||||
|
||||
} else {
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='flex py-10 justify-center items-center space-x-3'>
|
||||
<div className="flex py-10 justify-center items-center space-x-3">
|
||||
<h1>Installation Complete</h1>
|
||||
<br />
|
||||
<Check size={32} />
|
||||
<div onClick={finishInstall} className='p-3 font-bold bg-gray-200 text-gray-900 rounded-lg hover:cursor-pointer' >
|
||||
<div
|
||||
onClick={finishInstall}
|
||||
className="p-3 font-bold bg-gray-200 text-gray-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Next Step
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default Finish
|
||||
export default Finish
|
||||
|
|
|
|||
|
|
@ -1,69 +1,80 @@
|
|||
import PageLoading from '@components/Objects/Loaders/PageLoading';
|
||||
import { getAPIUrl } from '@services/config/config';
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import PageLoading from '@components/Objects/Loaders/PageLoading'
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import React, { useEffect } from 'react'
|
||||
import useSWR, { mutate } from "swr";
|
||||
import useSWR, { mutate } from 'swr'
|
||||
|
||||
function GetStarted() {
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const router = useRouter()
|
||||
|
||||
async function startInstallation() {
|
||||
let res = await fetch(`${getAPIUrl()}install/start`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({})
|
||||
})
|
||||
|
||||
if (res.status == 200) {
|
||||
mutate(`${getAPIUrl()}install/latest`)
|
||||
router.refresh();
|
||||
router.push(`/install?step=1`)
|
||||
}
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const router = useRouter()
|
||||
|
||||
async function startInstallation() {
|
||||
let res = await fetch(`${getAPIUrl()}install/start`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({}),
|
||||
})
|
||||
|
||||
if (res.status == 200) {
|
||||
mutate(`${getAPIUrl()}install/latest`)
|
||||
router.refresh()
|
||||
router.push(`/install?step=1`)
|
||||
}
|
||||
}
|
||||
|
||||
function redirectToStep() {
|
||||
const step = install.step
|
||||
router.push(`/install?step=${step}`)
|
||||
}
|
||||
function redirectToStep() {
|
||||
const step = install.step
|
||||
router.push(`/install?step=${step}`)
|
||||
}
|
||||
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
if (install) {
|
||||
redirectToStep()
|
||||
}
|
||||
}, [install])
|
||||
|
||||
|
||||
if (error) return <div className='flex py-10 justify-center items-center space-x-3'>
|
||||
<h1>Start a new installation</h1>
|
||||
<div onClick={startInstallation} className='p-3 font-bold bg-green-200 text-green-900 rounded-lg hover:cursor-pointer' >
|
||||
Start
|
||||
</div>
|
||||
</div>
|
||||
|
||||
if (isLoading) return <PageLoading />
|
||||
useEffect(() => {
|
||||
if (install) {
|
||||
return (
|
||||
<div>
|
||||
<div className='flex py-10 justify-center items-center space-x-3'>
|
||||
<h1>You already started an installation</h1>
|
||||
<div onClick={redirectToStep} className='p-3 font-bold bg-orange-200 text-orange-900 rounded-lg hover:cursor-pointer' >
|
||||
Continue
|
||||
</div>
|
||||
<div onClick={startInstallation} className='p-3 font-bold bg-green-200 text-green-900 rounded-lg hover:cursor-pointer' >
|
||||
Start
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
redirectToStep()
|
||||
}
|
||||
}, [install])
|
||||
|
||||
if (error)
|
||||
return (
|
||||
<div className="flex py-10 justify-center items-center space-x-3">
|
||||
<h1>Start a new installation</h1>
|
||||
<div
|
||||
onClick={startInstallation}
|
||||
className="p-3 font-bold bg-green-200 text-green-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Start
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
if (isLoading) return <PageLoading />
|
||||
if (install) {
|
||||
return (
|
||||
<div>
|
||||
<div className="flex py-10 justify-center items-center space-x-3">
|
||||
<h1>You already started an installation</h1>
|
||||
<div
|
||||
onClick={redirectToStep}
|
||||
className="p-3 font-bold bg-orange-200 text-orange-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Continue
|
||||
</div>
|
||||
<div
|
||||
onClick={startInstallation}
|
||||
className="p-3 font-bold bg-green-200 text-green-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Start
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default GetStarted
|
||||
export default GetStarted
|
||||
|
|
|
|||
|
|
@ -1,137 +1,166 @@
|
|||
|
||||
import FormLayout, { ButtonBlack, FormField, FormLabelAndMessage, Input } from '@components/StyledElements/Form/Form'
|
||||
import * as Form from '@radix-ui/react-form';
|
||||
import { useFormik } from 'formik';
|
||||
import { BarLoader } from 'react-spinners';
|
||||
import FormLayout, {
|
||||
ButtonBlack,
|
||||
FormField,
|
||||
FormLabelAndMessage,
|
||||
Input,
|
||||
} from '@components/StyledElements/Form/Form'
|
||||
import * as Form from '@radix-ui/react-form'
|
||||
import { useFormik } from 'formik'
|
||||
import { BarLoader } from 'react-spinners'
|
||||
import React from 'react'
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { getAPIUrl } from '@services/config/config';
|
||||
import useSWR from "swr";
|
||||
import { createNewOrgInstall, updateInstall } from '@services/install/install';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { Check } from 'lucide-react';
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import useSWR from 'swr'
|
||||
import { createNewOrgInstall, updateInstall } from '@services/install/install'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import { Check } from 'lucide-react'
|
||||
|
||||
const validate = (values: any) => {
|
||||
const errors: any = {};
|
||||
const errors: any = {}
|
||||
|
||||
if (!values.name) {
|
||||
errors.name = 'Required';
|
||||
}
|
||||
if (!values.name) {
|
||||
errors.name = 'Required'
|
||||
}
|
||||
|
||||
if (!values.description) {
|
||||
errors.description = 'Required';
|
||||
}
|
||||
if (!values.description) {
|
||||
errors.description = 'Required'
|
||||
}
|
||||
|
||||
if (!values.slug) {
|
||||
errors.slug = 'Required';
|
||||
}
|
||||
if (!values.slug) {
|
||||
errors.slug = 'Required'
|
||||
}
|
||||
|
||||
if (!values.email) {
|
||||
errors.email = 'Required';
|
||||
}
|
||||
else if (
|
||||
!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)
|
||||
) {
|
||||
errors.email = 'Invalid email address';
|
||||
}
|
||||
if (!values.email) {
|
||||
errors.email = 'Required'
|
||||
} else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)) {
|
||||
errors.email = 'Invalid email address'
|
||||
}
|
||||
|
||||
|
||||
|
||||
return errors;
|
||||
};
|
||||
|
||||
function OrgCreation() {
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false);
|
||||
const [isSubmitted, setIsSubmitted] = React.useState(false);
|
||||
const router = useRouter()
|
||||
|
||||
|
||||
function createOrgAndUpdateInstall(values: any) {
|
||||
try {
|
||||
createNewOrgInstall(values)
|
||||
install.data = {
|
||||
1: values
|
||||
}
|
||||
let install_data = { ...install.data, 1: values }
|
||||
updateInstall(install_data, 2)
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
|
||||
router.push('/install?step=2')
|
||||
setIsSubmitted(true)
|
||||
}
|
||||
catch (e) {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
name: '',
|
||||
description: '',
|
||||
slug: '',
|
||||
email: '',
|
||||
},
|
||||
validate,
|
||||
onSubmit: values => {
|
||||
createOrgAndUpdateInstall(values)
|
||||
},
|
||||
});
|
||||
return (
|
||||
<div>
|
||||
<FormLayout onSubmit={formik.handleSubmit}>
|
||||
<FormField name="name">
|
||||
<FormLabelAndMessage label='Name' message={formik.errors.name} />
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.name} type="text" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<FormField name="description">
|
||||
<FormLabelAndMessage label='Description' message={formik.errors.description} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.description} type="text" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<FormField name="slug">
|
||||
|
||||
<FormLabelAndMessage label='Slug' message={formik.errors.slug} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.slug} type="text" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for username */}
|
||||
<FormField name="email">
|
||||
|
||||
<FormLabelAndMessage label='Email' message={formik.errors.email} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input onChange={formik.handleChange} value={formik.values.email} type="email" required />
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<div className="flex flex-row-reverse py-4">
|
||||
<Form.Submit asChild>
|
||||
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
|
||||
{isSubmitting ? <BarLoader cssOverride={{ borderRadius: 60, }} width={60} color="#ffffff" />
|
||||
: "Create Organization"}
|
||||
</ButtonBlack>
|
||||
</Form.Submit>
|
||||
</div>
|
||||
|
||||
{isSubmitted && <div className='flex space-x-3'> <Check /> Organization Created Successfully</div>}
|
||||
|
||||
|
||||
</FormLayout>
|
||||
</div>
|
||||
)
|
||||
return errors
|
||||
}
|
||||
|
||||
export default OrgCreation
|
||||
function OrgCreation() {
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const [isSubmitting, setIsSubmitting] = React.useState(false)
|
||||
const [isSubmitted, setIsSubmitted] = React.useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
function createOrgAndUpdateInstall(values: any) {
|
||||
try {
|
||||
createNewOrgInstall(values)
|
||||
install.data = {
|
||||
1: values,
|
||||
}
|
||||
let install_data = { ...install.data, 1: values }
|
||||
updateInstall(install_data, 2)
|
||||
// await 2 seconds
|
||||
setTimeout(() => {
|
||||
setIsSubmitting(false)
|
||||
}, 2000)
|
||||
|
||||
router.push('/install?step=2')
|
||||
setIsSubmitted(true)
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
name: '',
|
||||
description: '',
|
||||
slug: '',
|
||||
email: '',
|
||||
},
|
||||
validate,
|
||||
onSubmit: (values) => {
|
||||
createOrgAndUpdateInstall(values)
|
||||
},
|
||||
})
|
||||
return (
|
||||
<div>
|
||||
<FormLayout onSubmit={formik.handleSubmit}>
|
||||
<FormField name="name">
|
||||
<FormLabelAndMessage label="Name" message={formik.errors.name} />
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.name}
|
||||
type="text"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<FormField name="description">
|
||||
<FormLabelAndMessage
|
||||
label="Description"
|
||||
message={formik.errors.description}
|
||||
/>
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.description}
|
||||
type="text"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<FormField name="slug">
|
||||
<FormLabelAndMessage label="Slug" message={formik.errors.slug} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.slug}
|
||||
type="text"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
{/* for username */}
|
||||
<FormField name="email">
|
||||
<FormLabelAndMessage label="Email" message={formik.errors.email} />
|
||||
|
||||
<Form.Control asChild>
|
||||
<Input
|
||||
onChange={formik.handleChange}
|
||||
value={formik.values.email}
|
||||
type="email"
|
||||
required
|
||||
/>
|
||||
</Form.Control>
|
||||
</FormField>
|
||||
|
||||
<div className="flex flex-row-reverse py-4">
|
||||
<Form.Submit asChild>
|
||||
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
|
||||
{isSubmitting ? (
|
||||
<BarLoader
|
||||
cssOverride={{ borderRadius: 60 }}
|
||||
width={60}
|
||||
color="#ffffff"
|
||||
/>
|
||||
) : (
|
||||
'Create Organization'
|
||||
)}
|
||||
</ButtonBlack>
|
||||
</Form.Submit>
|
||||
</div>
|
||||
|
||||
{isSubmitted && (
|
||||
<div className="flex space-x-3">
|
||||
{' '}
|
||||
<Check /> Organization Created Successfully
|
||||
</div>
|
||||
)}
|
||||
</FormLayout>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrgCreation
|
||||
|
|
|
|||
|
|
@ -1,43 +1,46 @@
|
|||
import { getAPIUrl } from '@services/config/config';
|
||||
import { createSampleDataInstall, updateInstall } from '@services/install/install';
|
||||
import { swrFetcher } from '@services/utils/ts/requests';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { getAPIUrl } from '@services/config/config'
|
||||
import {
|
||||
createSampleDataInstall,
|
||||
updateInstall,
|
||||
} from '@services/install/install'
|
||||
import { swrFetcher } from '@services/utils/ts/requests'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import React from 'react'
|
||||
import useSWR from "swr";
|
||||
import useSWR from 'swr'
|
||||
|
||||
function SampleData() {
|
||||
const { data: install, error: error, isLoading } = useSWR(`${getAPIUrl()}install/latest`, swrFetcher);
|
||||
const {
|
||||
data: install,
|
||||
error: error,
|
||||
isLoading,
|
||||
} = useSWR(`${getAPIUrl()}install/latest`, swrFetcher)
|
||||
const router = useRouter()
|
||||
|
||||
function createSampleData() {
|
||||
|
||||
try {
|
||||
let username = install.data[3].username
|
||||
let slug = install.data[1].slug
|
||||
|
||||
|
||||
createSampleDataInstall(username, slug)
|
||||
|
||||
let install_data = { ...install.data, 4: { status: 'OK' } }
|
||||
updateInstall(install_data, 5)
|
||||
|
||||
router.push('/install?step=5')
|
||||
|
||||
}
|
||||
catch (e) {
|
||||
|
||||
}
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className='flex py-10 justify-center items-center space-x-3'>
|
||||
<div className="flex py-10 justify-center items-center space-x-3">
|
||||
<h1>Install Sample data on your organization </h1>
|
||||
<div onClick={createSampleData} className='p-3 font-bold bg-purple-200 text-pruple-900 rounded-lg hover:cursor-pointer' >
|
||||
<div
|
||||
onClick={createSampleData}
|
||||
className="p-3 font-bold bg-purple-200 text-pruple-900 rounded-lg hover:cursor-pointer"
|
||||
>
|
||||
Start
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SampleData
|
||||
export default SampleData
|
||||
|
|
|
|||
|
|
@ -1,53 +1,52 @@
|
|||
import AccountCreation from "./account_creation";
|
||||
import DefaultElements from "./default_elements";
|
||||
import DisableInstallMode from "./disable_install_mode";
|
||||
import Finish from "./finish";
|
||||
import GetStarted from "./get_started";
|
||||
import OrgCreation from "./org_creation";
|
||||
import SampleData from "./sample_data";
|
||||
import AccountCreation from './account_creation'
|
||||
import DefaultElements from './default_elements'
|
||||
import DisableInstallMode from './disable_install_mode'
|
||||
import Finish from './finish'
|
||||
import GetStarted from './get_started'
|
||||
import OrgCreation from './org_creation'
|
||||
import SampleData from './sample_data'
|
||||
|
||||
export const INSTALL_STEPS = [
|
||||
{
|
||||
id: "INSTALL_STATUS",
|
||||
name: "Get started",
|
||||
id: 'INSTALL_STATUS',
|
||||
name: 'Get started',
|
||||
component: <GetStarted />,
|
||||
completed: false,
|
||||
},
|
||||
{
|
||||
id: "ORGANIZATION_CREATION",
|
||||
name: "Organization Creation",
|
||||
id: 'ORGANIZATION_CREATION',
|
||||
name: 'Organization Creation',
|
||||
component: <OrgCreation />,
|
||||
completed: false,
|
||||
},
|
||||
{
|
||||
id: "DEFAULT_ELEMENTS",
|
||||
name: "Default Elements",
|
||||
id: 'DEFAULT_ELEMENTS',
|
||||
name: 'Default Elements',
|
||||
component: <DefaultElements />,
|
||||
completed: false,
|
||||
},
|
||||
{
|
||||
id: "ACCOUNT_CREATION",
|
||||
name: "Account Creation",
|
||||
id: 'ACCOUNT_CREATION',
|
||||
name: 'Account Creation',
|
||||
component: <AccountCreation />,
|
||||
completed: false,
|
||||
},
|
||||
{
|
||||
id: "SAMPLE_DATA",
|
||||
name: "Sample Data",
|
||||
id: 'SAMPLE_DATA',
|
||||
name: 'Sample Data',
|
||||
component: <SampleData />,
|
||||
completed: false,
|
||||
},
|
||||
{
|
||||
id: "FINISH",
|
||||
name: "Finish",
|
||||
id: 'FINISH',
|
||||
name: 'Finish',
|
||||
component: <Finish />,
|
||||
completed: false,
|
||||
|
||||
},
|
||||
{
|
||||
id: "DISABLING_INSTALLATION_MODE",
|
||||
name: "Disabling Installation Mode",
|
||||
id: 'DISABLING_INSTALLATION_MODE',
|
||||
name: 'Disabling Installation Mode',
|
||||
component: <DisableInstallMode />,
|
||||
completed: false,
|
||||
},
|
||||
];
|
||||
]
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue