Skip to content

Commit

Permalink
fix(src): 🐛 some fixes, idk what exactly
Browse files Browse the repository at this point in the history
  • Loading branch information
Nudelsuppe42 committed Nov 27, 2023
1 parent 142c5fb commit 50487cc
Show file tree
Hide file tree
Showing 7 changed files with 273 additions and 65 deletions.
10 changes: 9 additions & 1 deletion src/components/Icon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,15 @@ import { useMantineColorScheme } from '@mantine/core';
/* eslint-disable jsx-a11y/alt-text */
const Icon = ({ name, ...rest }: any) => {
const scheme = useMantineColorScheme();
return <img src={'/icons/' + name + '.svg'} {...rest} style={{ filter: scheme.colorScheme == 'dark' ? 'invert(100%)' : '', ...rest.style }} />;
return name != '' ? (
<img
src={'/icons/' + name + '.svg'}
{...rest}
style={{ filter: scheme.colorScheme == 'dark' ? 'invert(100%)' : '', ...rest.style }}
/>
) : (
<></>
);
};

export default Icon;
3 changes: 2 additions & 1 deletion src/components/SWRSetup.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { SWRConfig } from 'swr';
import { useSession } from 'next-auth/react';
import { SWRConfig } from 'swr';

export default function SWRSetup({ content }: any) {
const session = useSession();
Expand All @@ -12,6 +12,7 @@ export default function SWRSetup({ content }: any) {
refreshInterval: 0,
fetcher: (resource: any, init: any) => {
if (!resource.includes('/undefined')) {
console.log(session?.data?.accessToken);
return fetch(process.env.NEXT_PUBLIC_API_URL + resource, {
headers: {
'Access-Control-Allow-Origin': '*',
Expand Down
18 changes: 15 additions & 3 deletions src/components/application/questions/CheckboxQuestion.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Switch } from '@mantine/core';
import { IconCheckbox } from '@tabler/icons';
import { ApplicationQuestion } from '../../../utils/application/ApplicationQuestions';
import Icon from '../../Icon';
import { IconCheckbox } from '@tabler/icons';
import { Switch } from '@mantine/core';

export interface CheckboxQuestionProps extends ApplicationQuestion {
additionalData: {};
Expand All @@ -15,7 +15,19 @@ function validation(props: CheckboxQuestionProps): (value: string) => void {

const CheckboxQuestion = (props: CheckboxQuestionProps) => {
return (
<Switch onLabel={<Icon name={props.icon} />} offLabel={<Icon name={props.icon} />} required={props.required} description={props.subtitle} label={props.title} style={props.style} onChange={(e) => props.onChange && props.onChange(e.target.checked)} error={props.error} disabled={props.disabled} readOnly={props.readonly} value={props.value} />
<Switch
onLabel={<Icon name={props.icon} />}
offLabel={<Icon name={props.icon} />}
required={props.required}
description={props.subtitle}
label={props.title}
style={props.style}
onChange={(e) => props.onChange && props.onChange(e.target.checked)}
error={props.error}
disabled={props.disabled}
readOnly={props.readonly}
checked={props.value}
/>
);
};

Expand Down
85 changes: 66 additions & 19 deletions src/pages/me/index.tsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import { Avatar, Badge, Button, Code, Grid, Group, Stack, Text, rem, useMantineColorScheme, useMantineTheme } from '@mantine/core';
import { IconConfetti, IconCrane, IconExternalLink, IconLogout, IconPencil, IconPin } from '@tabler/icons-react';

import Link from 'next/link';
import { NextPage } from 'next';
import Page from '../../components/Page';
import { Pin } from 'tabler-icons-react';
import getCountryName from '../../utils/ISOCountries';
import router from 'next/router';
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import { signOut } from 'next-auth/react';
import useSWR from 'swr';
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import Link from 'next/link';
import router from 'next/router';
import { useTranslation } from 'react-i18next';
import useSWR from 'swr';
import { Pin } from 'tabler-icons-react';
import Page from '../../components/Page';
import { useUser } from '../../hooks/useUser';
import getCountryName from '../../utils/ISOCountries';

const MePage: NextPage = () => {
const user = useUser();
Expand All @@ -37,11 +37,21 @@ const MePage: NextPage = () => {
{t('account.minecraft')} <Code>{data.name}</Code>
</Text>
<Group>
<Button leftSection={<IconPencil />} component={Link} href={`/me/settings/general`} mt="md">
<Button
leftSection={<IconPencil />}
component={Link}
href={`/me/settings/general`}
mt="md"
>
{t('account.settings')}
</Button>

<Button leftSection={<IconLogout />} mt="md" onClick={() => signOut({ callbackUrl: '/' })} variant="outline">
<Button
leftSection={<IconLogout />}
mt="md"
onClick={() => signOut({ callbackUrl: '/' })}
variant="outline"
>
{t('common:auth.signout')}
</Button>
</Group>
Expand All @@ -54,12 +64,13 @@ const MePage: NextPage = () => {
<Group
wrap="nowrap"
style={{
backgroundColor: scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
backgroundColor:
scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
borderRadius: theme.radius.xs,
cursor: 'pointer',
}}
p="md"
onClick={() => router.push(`/teams/${element.id}`)}
onClick={() => router.push(`/teams/${element.slug}`)}
>
<Avatar src={element.icon} size={94} radius="md" />
<div>
Expand Down Expand Up @@ -88,7 +99,8 @@ const MePage: NextPage = () => {
<Grid.Col
span={12}
style={{
backgroundColor: scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
backgroundColor:
scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
borderRadius: theme.radius.xs,
cursor: 'pointer',
minHeight: '10vh',
Expand All @@ -99,7 +111,12 @@ const MePage: NextPage = () => {
<Text fw="bold" size="lg">
{t('teams.empty.description')}
</Text>
<Button leftSection={<IconExternalLink />} variant="gradient" component={Link} href="/teams">
<Button
leftSection={<IconExternalLink />}
variant="gradient"
component={Link}
href="/teams"
>
{t('teams.empty.action')}
</Button>
</Stack>
Expand All @@ -116,7 +133,10 @@ const MePage: NextPage = () => {
<Group
wrap="nowrap"
style={{
backgroundColor: scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
backgroundColor:
scheme.colorScheme === 'dark'
? theme.colors.dark[6]
: theme.colors.gray[1],
borderRadius: theme.radius.xs,
cursor: 'pointer',
}}
Expand All @@ -141,7 +161,14 @@ const MePage: NextPage = () => {
.join(', ')}
</Text>
</Group>
<Button mt="xs" variant="gradient" size="xs" leftSection={<IconPencil />} component={Link} href={`/teams/${element.id}/settings`}>
<Button
mt="xs"
variant="gradient"
size="xs"
leftSection={<IconPencil />}
component={Link}
href={`/teams/${element.id}/settings`}
>
{t('owned.action')}
</Button>
</div>
Expand All @@ -161,7 +188,10 @@ const MePage: NextPage = () => {
<Group
wrap="nowrap"
style={{
backgroundColor: scheme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],
backgroundColor:
scheme.colorScheme === 'dark'
? theme.colors.dark[6]
: theme.colors.gray[1],
borderRadius: theme.radius.xs,
cursor: 'pointer',
}}
Expand All @@ -177,16 +207,33 @@ const MePage: NextPage = () => {
</Text>
</Group>
{element.finished ? (
<Badge variant="gradient" gradient={{ from: 'green', to: 'lime' }} leftSection={<IconConfetti style={{ width: rem(16), height: rem(16) }} />}>
<Badge
variant="gradient"
gradient={{ from: 'green', to: 'lime' }}
leftSection={
<IconConfetti style={{ width: rem(16), height: rem(16) }} />
}
>
{t('claims.status.finished')}
</Badge>
) : (
<Badge variant="gradient" gradient={{ from: 'orange', to: 'yellow' }} leftSection={<IconCrane style={{ width: rem(12), height: rem(12) }} />}>
<Badge
variant="gradient"
gradient={{ from: 'orange', to: 'yellow' }}
leftSection={<IconCrane style={{ width: rem(12), height: rem(12) }} />}
>
{t('claims.status.building')}
</Badge>
)}
<Group justify="space-between">
<Button mt="xs" variant="gradient" size="xs" leftSection={<IconPencil />} component={Link} href={`/me/claims/${element.id}`}>
<Button
mt="xs"
variant="gradient"
size="xs"
leftSection={<IconPencil />}
component={Link}
href={`/me/claims/${element.id}`}
>
{t('claims.action')}
</Button>
</Group>
Expand Down
60 changes: 50 additions & 10 deletions src/pages/teams/[team]/apply.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,9 @@ const Apply: NextPage = ({ data, buildteam }: any) => {
const team = router.query.team;
const theme = useMantineTheme();
const user = useUser();
const { data: pastApplications } = useSWR(`/buildteams/${buildteam?.id}/applications/user/${user.user?.id}`);
const { data: pastApplications } = useSWR(
`/buildteams/${buildteam?.id}/applications/user/${user.user?.id}`,
);
const { t } = useTranslation('teams');
const [loading, setLoading] = useState(false);
const [trial, setTrial] = useState(false);
Expand All @@ -33,7 +35,7 @@ const Apply: NextPage = ({ data, buildteam }: any) => {
setLoading(true);
fetch(
process.env.NEXT_PUBLIC_API_URL +
`/buildteams/${team}/apply${trial ? '?trial=true&slug=true' : ''}`,
`/buildteams/${team}/apply${trial ? '?trial=true&slug=true' : '?slug=true'}`,
{
method: 'POST',
headers: {
Expand Down Expand Up @@ -81,11 +83,17 @@ const Apply: NextPage = ({ data, buildteam }: any) => {
) : (
<form onSubmit={form.onSubmit(handleSubmit)}>
<div dangerouslySetInnerHTML={{ __html: sanitize(buildteam?.about) }} />
{!pastApplications?.some((a: any) => a.status == 'SEND' || a.status == 'REVIEWING' || a.status == 'ACCEPTED') ? (
{!pastApplications?.some(
(a: any) => a.status == 'SEND' || a.status == 'REVIEWING' || a.status == 'ACCEPTED',
) ? (
<>
{buildteam?.allowTrial && (
<>
<Alert mb="md" icon={<IconAlertCircle size="1rem" />} title={t('apply.trial.title')}>
<Alert
mb="md"
icon={<IconAlertCircle size="1rem" />}
title={t('apply.trial.title')}
>
{t('apply.trial.description')}
</Alert>
<SegmentedControl
Expand All @@ -107,29 +115,60 @@ const Apply: NextPage = ({ data, buildteam }: any) => {
?.filter((d: any) => d.trial == trial)
.map((d: any, i: number) => {
const Question = ApplicationQuestions[d.type];
return <Question key={d.id} {...d} style={{ marginTop: i > 0 && theme.spacing.md, maxWidth: '55%' }} onChange={(v: any) => form.setFieldValue(d.id, v)} error={form.errors[d.id]} disabled={loading} />;
return (
<Question
key={d.id}
{...d}
style={{ marginTop: i > 0 && theme.spacing.md, maxWidth: '55%' }}
onChange={(v: any) => form.setFieldValue(d.id, v)}
error={form.errors[d.id]}
disabled={loading}
/>
);
})}
<Button type="submit" variant="filled" color="blue" mt="md" loading={loading}>
{t('common:button.apply')}
</Button>
<Button variant="outline" color="blue" ml="md" mt="md" onClick={() => router.back()} disabled={loading}>
<Button
variant="outline"
color="blue"
ml="md"
mt="md"
onClick={() => router.back()}
disabled={loading}
>
{t('common:button.cancel')}
</Button>
</>
) : (
<>
{pastApplications.some((a: any) => a.status == 'SEND' || a.status == 'REVIEWING') && (
<>
<Alert title={t('apply.duplicate.pending.title')} color="yellow" icon={<IconAlertCircle size="1rem" />} mt="md">
{t('apply.duplicate.pending.description', { date: new Date(pastApplications[0].createdAt).toLocaleDateString() })}
<Alert
title={t('apply.duplicate.pending.title')}
color="yellow"
icon={<IconAlertCircle size="1rem" />}
mt="md"
>
{t('apply.duplicate.pending.description', {
date: new Date(pastApplications[0].createdAt).toLocaleDateString(),
})}
</Alert>
</>
)}
{pastApplications
.filter((a: any) => a.status == 'ACCEPTED')
.map((a: any, i: number) => (
<Alert title={t('apply.duplicate.accepted.title')} color="green" icon={<IconAlertCircle size="1rem" />} mt="md" key={i}>
{t('apply.duplicate.accepted.description', { date: new Date(pastApplications[0].createdAt).toLocaleDateString() })}
<Alert
title={t('apply.duplicate.accepted.title')}
color="green"
icon={<IconAlertCircle size="1rem" />}
mt="md"
key={i}
>
{t('apply.duplicate.accepted.description', {
date: new Date(pastApplications[0].createdAt).toLocaleDateString(),
})}
</Alert>
))}
<Button leftSection={<IconChevronLeft />} mt="md" onClick={() => router.back()}>
Expand All @@ -145,6 +184,7 @@ const Apply: NextPage = ({ data, buildteam }: any) => {
export default Apply;
export async function getStaticProps({ locale, params }: any) {
const res = await fetcher(`/buildteams/${params.team}/application/questions?slug=true`);
console.log(res);
const res2 = await fetcher(`/buildteams/${params.team}?slug=true`);
return {
props: {
Expand Down
Loading

0 comments on commit 50487cc

Please sign in to comment.