Skip to content

Commit 565baa7

Browse files
multimokiamultimokia
committed
Merge remote-tracking branch 'origin/main' into FROS-Mini-Profiles
2 parents 4e6340a + fc77617 commit 565baa7

35 files changed

Lines changed: 1143 additions & 349 deletions

‎.env.example‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,9 @@
22
NEXT_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_URL
33
NEXT_PUBLIC_SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY
44
PROJECT_ID=SUPABASE_REFERENCE_ID
5+
6+
LK_API_KEY=devkey
7+
LK_API_SECRET=secret
8+
9+
NEXT_PUBLIC_LK_TOKEN_ENDPOINT=PATH_TO_TOKEN_GENERATOR
10+
NEXT_PUBLIC_LK_SERVER_URL=URL_TO_LIVEKITSERVER

‎.github/dependabot.yml‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# To get started with Dependabot version updates, you'll need to specify which
2+
# package ecosystems to update and where the package manifests are located.
3+
# Please see the documentation for all configuration options:
4+
# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
5+
6+
version: 2
7+
updates:
8+
- package-ecosystem: "npm"
9+
directory: "/" # Location of package manifests
10+
schedule:
11+
interval: "weekly"

‎components/forms/AddServer.tsx‎

Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
import CameraIcon from '@/components/icons/CameraIcon';
2+
import { Input } from './Styles';
3+
import styles from '@/styles/Components.module.css';
4+
import PlusIcon from '@/components/icons/PlusIcon';
5+
import {
6+
useRef,
7+
ChangeEvent,
8+
Dispatch,
9+
SetStateAction,
10+
useEffect,
11+
} from 'react';
12+
import Image from 'next/image';
13+
import { createServerSchema, CreateServerInput } from '@/types/client/server';
14+
import { FieldErrorsImpl, useForm, UseFormRegister } from 'react-hook-form';
15+
import { zodResolver } from '@hookform/resolvers/zod';
16+
17+
export default function AddServer({
18+
serverImage,
19+
setServerImage,
20+
register,
21+
errors,
22+
serverError,
23+
showDesc,
24+
setShowDesc,
25+
}: {
26+
serverImage: File | null;
27+
setServerImage: Dispatch<SetStateAction<File | null>>;
28+
register: UseFormRegister<{
29+
name: string;
30+
description?: string | undefined;
31+
}>;
32+
errors: Partial<
33+
FieldErrorsImpl<{
34+
name: string;
35+
description: string;
36+
}>
37+
>;
38+
serverError: string;
39+
showDesc: boolean;
40+
setShowDesc: Dispatch<SetStateAction<boolean>>;
41+
}) {
42+
const imageRef = useRef<HTMLInputElement | null>(null);
43+
44+
const handleFileChange = (e: ChangeEvent<HTMLInputElement>) => {
45+
if (!e.target.files) {
46+
return;
47+
}
48+
49+
setServerImage(e.target.files[0]);
50+
};
51+
const previewImage = serverImage ? URL.createObjectURL(serverImage) : '';
52+
53+
return (
54+
<form
55+
className="flex flex-col w-12 my-4 mx-6"
56+
onSubmit={(e) => e.preventDefault()}
57+
>
58+
{serverError ? (
59+
<span className="my-2 text-red-700 text-sm font-bold">
60+
{serverError}
61+
</span>
62+
) : (
63+
''
64+
)}
65+
<div
66+
className={`${
67+
serverImage
68+
? 'p-4'
69+
: 'w-9 py-4 px-7 border-dashed border-2 border-grey-600'
70+
} flex items-center rounded-lg justify-center self-center relative hover:cursor-pointer`}
71+
onClick={() => imageRef?.current?.click()}
72+
>
73+
<div className="flex flex-col justify-center items-center">
74+
{serverImage ? (
75+
<Image alt="serverIcon" src={previewImage} width={50} height={50} />
76+
) : (
77+
<>
78+
<CameraIcon />
79+
<span className="text-sm font-semibold text-center tracking-wider">
80+
UPLOAD
81+
</span>
82+
<span className="absolute -top-3 -right-3">
83+
<PlusIcon color="#4abfe8" />
84+
</span>
85+
</>
86+
)}
87+
</div>
88+
</div>
89+
90+
<div className="flex flex-col mt-5">
91+
<div className="font-semibold tracking-wider">Server Name</div>
92+
<input
93+
type="file"
94+
ref={imageRef}
95+
onChange={handleFileChange}
96+
className="hidden"
97+
accept="image/*"
98+
/>
99+
<input
100+
className={`${Input('bg-grey-700')} mt-2 ${styles.input}`}
101+
type="text"
102+
placeholder="Enter server name"
103+
{...register('name')}
104+
/>
105+
{errors.name && (
106+
<p className="text-red-700 mt-2 text-sm font-bold">
107+
{errors.name.message}
108+
</p>
109+
)}
110+
{showDesc ? (
111+
<div className="mt-4">
112+
<div className="font-semibold tracking-wider">Description</div>
113+
<input
114+
className={`${Input('bg-grey-700')} mt-2 ${styles.input}`}
115+
type="text"
116+
placeholder="Enter a description"
117+
{...register('description')}
118+
/>
119+
{errors.description && (
120+
<p className="text-red-700 mt-2 text-sm font-bold">
121+
{errors.description.message}
122+
</p>
123+
)}
124+
</div>
125+
) : (
126+
<div
127+
className={`${styles.description} mt-4 text-frost-600 font-bold tracking-wide hover:cursor-pointer hover:text-frost-500 underline underline-offset-2`}
128+
onClick={() => setShowDesc(true)}
129+
>
130+
Add a description{' '}
131+
</div>
132+
)}
133+
</div>
134+
</form>
135+
);
136+
}

‎components/forms/Login.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export default function Login({
2828
formState: { errors, isSubmitting },
2929
} = useForm<CreateSessionInput>({
3030
resolver: zodResolver(createSessionSchema),
31-
mode: 'onChange'
31+
mode: 'onChange',
3232
});
3333

3434
const onSubmit = async (formData: CreateSessionInput) => {
@@ -51,11 +51,11 @@ export default function Login({
5151
<form className="flex flex-col" onSubmit={handleSubmit(onSubmit)}>
5252
<div className="relative mt-5">
5353
<div className={`${errors.email ? styles.iconError : styles.icon} `}>
54-
<EmailIcon/>
54+
<EmailIcon />
5555
</div>
5656
<input
5757
type="email"
58-
className={`${Input} ${styles.input}`}
58+
className={`${Input()} ${styles.input}`}
5959
placeholder="Enter Email"
6060
{...register('email')}
6161
></input>
@@ -68,11 +68,11 @@ export default function Login({
6868

6969
<div className={`${errors.email ? 'mt-2' : 'mt-7'} relative`}>
7070
<div className={`${errors.password ? styles.iconError : styles.icon} `}>
71-
<PasswordIcon/>
71+
<PasswordIcon />
7272
</div>
7373
<input
7474
type="password"
75-
className={`${Input} ${styles.input}`}
75+
className={`${Input()} ${styles.input}`}
7676
placeholder="Enter password"
7777
{...register('password')}
7878
></input>

‎components/forms/PasswordReset.tsx‎

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
import { Dispatch, SetStateAction } from 'react';
22
import { Input } from './Styles';
33
import styles from '@/styles/Auth.module.css';
4-
import { CreatePasswordInputRecovery, createPasswordRecoverySchema } from '@/types/client/passwordRecovery';
4+
import {
5+
CreatePasswordInputRecovery,
6+
createPasswordRecoverySchema,
7+
} from '@/types/client/passwordRecovery';
58
import { useForm } from 'react-hook-form';
69
import { zodResolver } from '@hookform/resolvers/zod';
710
import { useSupabaseClient } from '@supabase/auth-helpers-react';
@@ -16,7 +19,6 @@ export default function PasswordReset({
1619
setServerError: Dispatch<SetStateAction<string | null>>;
1720
setAuthType: Dispatch<SetStateAction<'login' | 'register' | 'resetPassword'>>;
1821
}) {
19-
2022
const supabase = useSupabaseClient<Database>();
2123

2224
const {
@@ -25,16 +27,18 @@ export default function PasswordReset({
2527
formState: { errors, isSubmitting },
2628
} = useForm<CreatePasswordInputRecovery>({
2729
resolver: zodResolver(createPasswordRecoverySchema),
28-
mode: 'onChange'
30+
mode: 'onChange',
2931
});
3032

31-
3233
const onSubmit = async (formData: CreatePasswordInputRecovery) => {
3334
let url = `${window.location.origin}/passwordreset`;
3435

35-
const { data, error } = await supabase.auth.resetPasswordForEmail(formData.email, {
36-
redirectTo: url,
37-
});
36+
const { data, error } = await supabase.auth.resetPasswordForEmail(
37+
formData.email,
38+
{
39+
redirectTo: url,
40+
}
41+
);
3842

3943
if (error) {
4044
setServerError(error.message);
@@ -45,26 +49,25 @@ export default function PasswordReset({
4549
if (data && !error) {
4650
toast.success(`An email has been sent to ${formData.email}`, {
4751
position: 'top-center',
48-
autoClose: 3000
52+
autoClose: 3000,
4953
});
5054
setAuthType('login');
5155
}
5256
};
5357

5458
return (
55-
<form className="flex flex-col" onSubmit={handleSubmit(onSubmit)} >
56-
<div className='text-3xl font-bold'>Password Recovery</div>
59+
<form className="flex flex-col" onSubmit={handleSubmit(onSubmit)}>
60+
<div className="text-3xl font-bold">Password Recovery</div>
5761
<label htmlFor="email" className="mt-6">
5862
Enter the Email that belongs to your account:
5963
</label>
6064
<div className="relative mt-3">
61-
6265
<div className={`${errors.email ? styles.iconError : styles.icon} `}>
63-
<EmailIcon/>
66+
<EmailIcon />
6467
</div>
6568
<input
6669
type="email"
67-
className={`${Input} ${styles.input}`}
70+
className={`${Input()} ${styles.input}`}
6871
placeholder="Enter Email"
6972
{...register('email')}
7073
></input>

‎components/forms/Register.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export default function Register({
2424
formState: { errors, isSubmitting },
2525
} = useForm<CreateUserInput>({
2626
resolver: zodResolver(createUserSchema),
27-
mode: 'onChange'
27+
mode: 'onChange',
2828
});
2929

3030
const onSubmit = async (formData: CreateUserInput) => {
@@ -55,11 +55,11 @@ export default function Register({
5555
>
5656
<div className="relative">
5757
<div className={`${errors.username ? styles.iconError : styles.icon} `}>
58-
<UsernameIcon/>
58+
<UsernameIcon />
5959
</div>
6060
<input
6161
type="text"
62-
className={`${Input} ${styles.input}`}
62+
className={`${Input()} ${styles.input}`}
6363
placeholder="Enter Username"
6464
{...register('username')}
6565
></input>
@@ -71,11 +71,11 @@ export default function Register({
7171
</div>
7272
<div className={`${errors.username ? 'mt-2' : 'mt-6'} relative`}>
7373
<div className={`${errors.email ? styles.iconError : styles.icon} `}>
74-
<EmailIcon/>
74+
<EmailIcon />
7575
</div>
7676
<input
7777
type="email"
78-
className={`${Input} ${styles.input}`}
78+
className={`${Input()} ${styles.input}`}
7979
placeholder="Enter Email"
8080
{...register('email')}
8181
></input>
@@ -88,11 +88,11 @@ export default function Register({
8888

8989
<div className={`${errors.email ? 'mt-2' : 'mt-6'} relative`}>
9090
<div className={`${errors.password ? styles.iconError : styles.icon} `}>
91-
<PasswordIcon/>
91+
<PasswordIcon />
9292
</div>
9393
<input
9494
type="password"
95-
className={`${Input} ${styles.input}`}
95+
className={`${Input()} ${styles.input}`}
9696
placeholder="Enter password"
9797
{...register('password')}
9898
></input>
@@ -109,11 +109,11 @@ export default function Register({
109109
errors.passwordConfirmation ? styles.iconError : styles.icon
110110
} `}
111111
>
112-
<PasswordIcon/>
112+
<PasswordIcon />
113113
</div>
114114
<input
115115
type="password"
116-
className={`${Input} ${styles.input}`}
116+
className={`${Input()} ${styles.input}`}
117117
placeholder="Confirm password"
118118
{...register('passwordConfirmation')}
119119
></input>

‎components/forms/Styles.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
export const Input = `w-full
1+
export function Input(bg = 'bg-inherit ') {
2+
return `w-full
23
py-2
34
pl-6
45
self-start
@@ -12,8 +13,9 @@ ease-in-out
1213
focus:outline-frost-50
1314
m-0
1415
focus:outline-none
15-
bg-inherit
16+
${bg}
1617
flex-1`;
18+
}
1719

1820
export const SearchBar = `w-full
1921
py-2

0 commit comments

Comments
 (0)