Skip to content
This repository has been archived by the owner on Feb 22, 2025. It is now read-only.

Commit

Permalink
merge(dev): 🔀 Push recent development changes to main branch
Browse files Browse the repository at this point in the history
  • Loading branch information
@Nudelsuppe42
Nudelsuppe42 authored Jun 1, 2024
2 parents ce575c9 + 2cdb5d9 commit 3de3e8e
Show file tree
Hide file tree
Showing 69 changed files with 1,037 additions and 790 deletions.
2 changes: 1 addition & 1 deletion .eslintrc.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"root": true,
"extends": "next",
"extends": ["next", "plugin:path/recommended"],
"rules": { "@next/next/no-img-element": 0 },
"ignorePatterns": ["**/dist/*"]
}
23 changes: 12 additions & 11 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,20 +17,20 @@
"@emotion/react": "^11.10.4",
"@emotion/server": "^11.10.0",
"@icons-pack/react-simple-icons": "^5.5.0",
"@mantine/carousel": "^7.8.0",
"@mantine/core": "^7.8.0",
"@mantine/dates": "^7.8.0",
"@mantine/dropzone": "^7.8.0",
"@mantine/form": "^7.8.0",
"@mantine/hooks": "^7.8.0",
"@mantine/modals": "^7.8.0",
"@mantine/carousel": "^7.10.1",
"@mantine/core": "^7.10.1",
"@mantine/dates": "^7.10.1",
"@mantine/dropzone": "^7.10.1",
"@mantine/form": "^7.10.1",
"@mantine/hooks": "^7.10.1",
"@mantine/modals": "^7.10.1",
"@mantine/next": "^6.0.21",
"@mantine/notifications": "^7.8.0",
"@mantine/nprogress": "^7.8.0",
"@mantine/notifications": "^7.10.1",
"@mantine/nprogress": "^7.10.1",
"@mantine/prism": "6.0.21",
"@mantine/rte": "^5.10.5",
"@mantine/spotlight": "^7.8.0",
"@mantine/tiptap": "^7.8.0",
"@mantine/spotlight": "^7.10.1",
"@mantine/tiptap": "^7.10.1",
"@mapbox/mapbox-gl-draw": "^1.4.3",
"@next/bundle-analyzer": "^13.5.6",
"@react-three/drei": "^9.56.10",
Expand Down Expand Up @@ -99,6 +99,7 @@
"eslint-plugin-filenames": "^1.3.2",
"eslint-plugin-i18n-text": "^1.0.1",
"eslint-plugin-no-only-tests": "^3.0.0",
"eslint-plugin-path": "^1.3.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.30.0",
"postcss": "^8.4.31",
Expand Down
68 changes: 39 additions & 29 deletions src/components/Header.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,3 @@
import {
Discord,
Instagram,
Reddit,
Tiktok,
Twitch,
Twitter,
Youtube,
} from '@icons-pack/react-simple-icons';
import {
ActionIcon,
Anchor,
Expand All @@ -21,14 +12,24 @@ import {
Menu,
MenuItem,
Paper,
rem,
Text,
Tooltip,
Transition,
UnstyledButton,
rem,
useMantineColorScheme,
useMantineTheme,
} from '@mantine/core';
import { ChevronDown, FileSearch, Logout, World } from 'tabler-icons-react';
import {
Discord,
Instagram,
Reddit,
Tiktok,
Twitch,
Twitter,
Youtube,
} from '@icons-pack/react-simple-icons';
import {
IconCalendar,
IconDashboard,
Expand All @@ -44,22 +45,22 @@ import {
IconUser,
IconUsers,
} from '@tabler/icons-react';
import { useScroll, useTransform } from 'framer-motion';
import { signIn, signOut, useSession } from 'next-auth/react';
import React, { CSSProperties, useState } from 'react';
import { ChevronDown, FileSearch, Logout, World } from 'tabler-icons-react';
import { signIn, signOut, useSession } from 'next-auth/react';
import { useScroll, useTransform } from 'framer-motion';

import { useDisclosure } from '@mantine/hooks';
import Icon from './Icon';
import Image from 'next/image';
import Link from 'next/link';
import classes from '../styles/components/Header.module.css';
import { hexToDataURL } from '../utils/Color';
import logo from '@/public/logo.gif';
import { useDisclosure } from '@mantine/hooks';
import { usePermissions } from '@/hooks/usePermissions';
import { useRouter } from 'next/router';
import { useTranslation } from 'react-i18next';
import logo from '../../public/logo.gif';
import { useScrollPosition } from '../hooks/useScrollPosition';
import { useTranslation } from 'react-i18next';
import { useUser } from '../hooks/useUser';
import classes from '../styles/components/Header.module.css';
import { hexToDataURL } from '../utils/Color';
import Icon from './Icon';

interface HeaderProps {
links: {
Expand All @@ -79,6 +80,7 @@ const Header = ({ links, style, solid }: HeaderProps) => {
const { data: session, status } = useSession();
const { scrollY } = useScrollPosition();
const user = useUser();
const permissions = usePermissions();

const items = links.map((link) => (
<Anchor
Expand Down Expand Up @@ -201,7 +203,7 @@ const Header = ({ links, style, solid }: HeaderProps) => {
>
{t('user.review')}
</Menu.Item>
{user.hasPermission('admin.admin') && (
{permissions.has('admin.admin') && (
<Menu.Item
leftSection={<IconDashboard size={14} />}
component={Link}
Expand All @@ -210,7 +212,7 @@ const Header = ({ links, style, solid }: HeaderProps) => {
Administration
</Menu.Item>
)}
{user.hasPermission('calendar.manage') && (
{permissions.has('calendar.manage') && (
<Menu.Item
leftSection={<IconCalendar size={14} />}
component={Link}
Expand All @@ -220,7 +222,14 @@ const Header = ({ links, style, solid }: HeaderProps) => {
</Menu.Item>
)}
<Menu.Divider />
<Menu.Item leftSection={<Logout size={14} />} color="red" onClick={() => signOut()}>
<Menu.Item
leftSection={<Logout size={14} />}
color="red"
onClick={() => {
window.localStorage.removeItem('auth-permission-state');
signOut();
}}
>
{t('auth.signout')}
</Menu.Item>
</Menu.Dropdown>
Expand Down Expand Up @@ -327,6 +336,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
const scheme = useMantineColorScheme();
const { scrollY, scrollYProgress } = useScroll();
const user = useUser();
const permissions = usePermissions();
const bgPosY = useTransform(scrollYProgress, (latest) => `${latest * 20 + 50}%`);
const userStatus = props?.members?.find((m: any) => m.id == user.user?.id)
? 'Joined'
Expand Down Expand Up @@ -452,7 +462,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
Apply
</Button>
)}
{user.hasPermissions(
{permissions.hasAny(
[
'team.settings.edit',
'team.socials.edit',
Expand Down Expand Up @@ -491,7 +501,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
component={Link}
href={props.settingsHref + '/settings' || ''}
disabled={
!user.hasPermissions(['team.settings.edit', 'team.socials.edit'], props.id)
!permissions.hasAny(['team.settings.edit', 'team.socials.edit'], props.id)
}
>
Settings
Expand All @@ -500,7 +510,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
leftSection={<IconSend style={{ width: rem(14), height: rem(14) }} />}
component={Link}
href={props.settingsHref + '/apply' || ''}
disabled={!user.hasPermissions(['team.application.edit'], props.id)}
disabled={!permissions.hasAny(['team.application.edit'], props.id)}
>
Application Questions
</MenuItem>
Expand All @@ -509,7 +519,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
component={Link}
href={props.settingsHref + '/members' || ''}
disabled={
!user.hasPermissions(['permission.add', 'permission.remove'], props.id)
!permissions.hasAny(['permission.add', 'permission.remove'], props.id)
}
>
Members
Expand All @@ -518,15 +528,15 @@ export const LogoHeader = (props: LogoHeaderProps) => {
leftSection={<IconPolygon style={{ width: rem(14), height: rem(14) }} />}
component={Link}
href={props.settingsHref + '/claims' || ''}
disabled={!user.hasPermissions(['team.claim.list'], props.id)}
disabled={!permissions.hasAny(['team.claim.list'], props.id)}
>
Claims
</MenuItem>
<MenuItem
leftSection={<IconPhoto style={{ width: rem(14), height: rem(14) }} />}
component={Link}
href={props.settingsHref + '/images' || ''}
disabled={!user.hasPermissions(['team.showcases.edit'], props.id)}
disabled={!permissions.hasAny(['team.showcases.edit'], props.id)}
>
Showcase Images
</MenuItem>
Expand All @@ -535,7 +545,7 @@ export const LogoHeader = (props: LogoHeaderProps) => {
component={Link}
href={props.settingsHref + '/review' || ''}
disabled={
!user.hasPermissions(
!permissions.hasAny(
['team.application.review', 'team.application.list'],
props.id,
)
Expand Down
17 changes: 9 additions & 8 deletions src/components/Page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,16 @@
import { Center, Container, Paper, Text, useMantineTheme } from '@mantine/core';
import { NextSeo, NextSeoProps } from 'next-seo';
import Header, { LogoHeader } from './Header';
import { NextSeo, NextSeoProps } from 'next-seo';

import BackgroundImage from './BackgroundImage';
import ErrorPage from '../pages/_error';
import Footer from './Footer';
import React from 'react';
import { StaticImport } from 'next/dist/shared/lib/get-img-props';
import classes from '../styles/components/Page.module.css';
import { usePermissions } from '@/hooks/usePermissions';
import { useRouter } from 'next/router';
import React from 'react';
import { useUser } from '../hooks/useUser';
import ErrorPage from '../pages/_error';
import classes from '../styles/components/Page.module.css';
import BackgroundImage from './BackgroundImage';
import Footer from './Footer';

interface PageProps {
children: React.ReactNode;
Expand Down Expand Up @@ -38,12 +39,12 @@ interface PageProps {

const Page = (props: PageProps) => {
const router = useRouter();
const user = useUser();
const permissions = usePermissions();
const theme = useMantineTheme();

return props.loading ? (
<ErrorPage code={'1'} />
) : props.requiredPermissions && !user.hasPermissions(props.requiredPermissions) ? (
) : props.requiredPermissions && !permissions.hasAny(props.requiredPermissions) ? (
<ErrorPage code={'403'} />
) : (
<>
Expand Down
34 changes: 21 additions & 13 deletions src/components/SettingsTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@ import {
} from '@tabler/icons-react';

import { useMediaQuery } from '@mantine/hooks';
import { useSession } from 'next-auth/react';
import { usePermissions } from '@/hooks/usePermissions';
import { useRouter } from 'next/router';
import { useSession } from 'next-auth/react';
import { useUser } from '../hooks/useUser';

const SettingsTabs = ({
Expand All @@ -34,7 +35,7 @@ const SettingsTabs = ({
}) => {
const theme = useMantineTheme();
const scheme = useMantineColorScheme();
const user = useUser();
const permissions = usePermissions();
const session = useSession();
const router = useRouter();
const mobileLayout = useMediaQuery('(max-width: 1600px)');
Expand Down Expand Up @@ -71,43 +72,43 @@ const SettingsTabs = ({
<Tabs.Tab
value="settings"
leftSection={<IconSettings size="0.8rem" />}
disabled={!user.hasPermissions(['team.socials.edit', 'team.settings.edit'], team)}
disabled={!permissions.hasAny(['team.socials.edit', 'team.settings.edit'], team)}
>
Settings
</Tabs.Tab>
<Tabs.Tab
value="apply"
leftSection={<IconSend size="0.8rem" />}
disabled={!user.hasPermission('team.application.edit', team)}
disabled={!permissions.has('team.application.edit', team)}
>
Application Questions
</Tabs.Tab>
<Tabs.Tab
value="members"
leftSection={<IconUsers size="0.8rem" />}
disabled={!user.hasPermissions(['permission.add', 'permission.remove'], team)}
disabled={!permissions.hasAny(['permission.add', 'permission.remove'], team)}
>
Members
</Tabs.Tab>
<Tabs.Tab
value="claims"
leftSection={<IconPolygon size="0.8rem" />}
disabled={!user.hasPermissions(['team.claim.list'], team)}
disabled={!permissions.hasAny(['team.claim.list'], team)}
>
Claims
</Tabs.Tab>
<Tabs.Tab
value="images"
leftSection={<IconPhoto size="0.8rem" />}
disabled={!user.hasPermission('team.showcases.edit', team)}
disabled={!permissions.has('team.showcases.edit', team)}
>
Showcase Images
</Tabs.Tab>
<Tabs.Tab
value="review"
leftSection={<IconSearch size="0.8rem" />}
disabled={
!user.hasPermissions(['team.application.review', 'team.application.list'], team)
!permissions.hasAny(['team.application.review', 'team.application.list'], team)
}
>
Review
Expand All @@ -127,7 +128,7 @@ const SettingsTabs = ({
position: 'relative',
})}
>
<LoadingOverlay visible={user.isLoading && loading} overlayProps={{ blur: 4 }} />
<LoadingOverlay visible={permissions.isLoading && loading} overlayProps={{ blur: 4 }} />
{children}
</Box>
</>
Expand All @@ -143,7 +144,7 @@ export const AdminSettingsTabs = ({
}) => {
const theme = useMantineTheme();
const scheme = useMantineColorScheme();
const user = useUser();
const permissions = usePermissions();
const session = useSession();
const router = useRouter();
const mobileLayout = useMediaQuery('(max-width: 1600px)');
Expand Down Expand Up @@ -178,17 +179,24 @@ export const AdminSettingsTabs = ({
<Tabs.Tab
value="cron"
leftSection={<IconClock size="0.8rem" />}
disabled={!user.hasPermissions(['admin.admin'])}
disabled={!permissions.hasAny(['admin.admin'])}
>
Cron
</Tabs.Tab>
<Tabs.Tab
value="claims"
leftSection={<IconPolygon size="0.8rem" />}
disabled={!user.hasPermissions(['admin.admin'])}
disabled={!permissions.hasAny(['admin.admin'])}
>
Claims
</Tabs.Tab>
<Tabs.Tab
value="images"
leftSection={<IconPolygon size="0.8rem" />}
disabled={!permissions.hasAny(['team.claim.list'])}
>
Claim Images
</Tabs.Tab>

<Tabs.Tab value="quit" leftSection={<IconHome size="0.8rem" />}>
Quit
Expand All @@ -205,7 +213,7 @@ export const AdminSettingsTabs = ({
position: 'relative',
})}
>
<LoadingOverlay visible={user.isLoading && loading} overlayProps={{ blur: 4 }} />
<LoadingOverlay visible={permissions.isLoading && loading} overlayProps={{ blur: 4 }} />
{children}
</Box>
</>
Expand Down
Loading

0 comments on commit 3de3e8e

Please sign in to comment.