Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: refactoring the components folder #150

Draft
wants to merge 1 commit into
base: dev
Choose a base branch
from
Draft

feat: refactoring the components folder #150

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 28 additions & 28 deletions pages/connection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,35 @@
import { Link, Stack, useBreakpointValue } from '@chakra-ui/react';
import { BsRocketTakeoffFill } from 'react-icons/bs';
import {Link, Stack, useBreakpointValue} from '@chakra-ui/react';
import {BsRocketTakeoffFill} from 'react-icons/bs';

import AuthPage from 'components/AuthPage';
import Button from 'components/Button';
import AuthPage from 'components/Pages/AuthPage';
import Button from 'components/Models/Button';

const Connection = (): JSX.Element => {
const isMobile = useBreakpointValue({ base: true, md: false }) || false;
const isMobile = useBreakpointValue({base: true, md: false}) || false;

return (
<AuthPage>
<Stack direction={{ base: 'column', md: 'row' }} w="100%" spacing="32px">
<Link href="/signup" w="100%">
<Button variant="primary" size={isMobile ? 'lg' : 'xl'} w="100%" id="ipc-home-create-account-button">
Create an account
</Button>
</Link>
<Link href="/login" w="100%">
<Button
variant="secondary"
size={isMobile ? 'lg' : 'xl'}
w="100%"
id="ipc-home-login-button"
buttonType="left-icon"
icon={BsRocketTakeoffFill}
>
Login
</Button>
</Link>
</Stack>
</AuthPage>
);
return (
<AuthPage>
<Stack direction={{base: 'column', md: 'row'}} w="100%" spacing="32px">
<Link href="/signup" w="100%">
<Button variant="primary" size={isMobile ? 'lg' : 'xl'} w="100%" id="ipc-home-create-account-button">
Create an account
</Button>
</Link>
<Link href="/login" w="100%">
<Button
variant="secondary"
size={isMobile ? 'lg' : 'xl'}
w="100%"
id="ipc-home-login-button"
buttonType="left-icon"
icon={BsRocketTakeoffFill}
>
Login
</Button>
</Link>
</Stack>
</AuthPage>
);
};

export default Connection;
20 changes: 10 additions & 10 deletions pages/drive/account.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
import { VStack } from '@chakra-ui/react';
import {VStack} from '@chakra-ui/react';

import AccountCard from 'components/account/AccountCard';
import ConfigCard from 'components/account/ConfigCard';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

const Account = (): JSX.Element => (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="Account" />
<AccountCard />
<ConfigCard />
</VStack>
</Navigation>
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="Account"/>
<AccountCard/>
<ConfigCard/>
</VStack>
</Navigation>
);

export default Account;
34 changes: 17 additions & 17 deletions pages/drive/contacts.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,26 @@
import { HStack, VStack } from '@chakra-ui/react';
import {HStack, VStack} from '@chakra-ui/react';

import DriveCards from 'components/cards/DriveCards';
import DriveCards from 'components/Models/cards/DriveCards';
import AddContact from 'components/contact/AddContact';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

import { useDriveContext } from 'contexts/drive';
import {useDriveContext} from 'contexts/drive';

const Contacts = (): JSX.Element => {
const { contacts } = useDriveContext();
const {contacts} = useDriveContext();

return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<HStack spacing="48px">
<LabelBadge label="Contacts" />
<AddContact />
</HStack>
<DriveCards contacts={contacts} />
</VStack>
</Navigation>
);
return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<HStack spacing="48px">
<LabelBadge label="Contacts"/>
<AddContact/>
</HStack>
<DriveCards contacts={contacts}/>
</VStack>
</Navigation>
);
};

export default Contacts;
108 changes: 54 additions & 54 deletions pages/drive/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,69 +1,69 @@
import { useColorMode, useToast, VStack } from '@chakra-ui/react';
import { useEffect } from 'react';
import {useColorMode, useToast, VStack} from '@chakra-ui/react';
import {useEffect} from 'react';

import { useConfigContext } from 'contexts/config';
import { useDriveContext } from 'contexts/drive';
import { useUserContext } from 'contexts/user';
import {useConfigContext} from 'contexts/config';
import {useDriveContext} from 'contexts/drive';
import {useUserContext} from 'contexts/user';

import DriveCards from 'components/cards/DriveCards';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import DriveCards from 'components/Models/cards/DriveCards';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

const Dashboard = (): JSX.Element => {
const toast = useToast({ duration: 2000, isClosable: true });
const { user } = useUserContext();
const { setConfig } = useConfigContext();
const { colorMode, toggleColorMode } = useColorMode();
const toast = useToast({duration: 2000, isClosable: true});
const {user} = useUserContext();
const {setConfig} = useConfigContext();
const {colorMode, toggleColorMode} = useColorMode();

const { path, folders, files, setFiles, setFolders, setContacts, setPrograms, setSharedFiles, setSharedPrograms } =
useDriveContext();
const {path, folders, files, setFiles, setFolders, setContacts, setPrograms, setSharedFiles, setSharedPrograms} =
useDriveContext();

useEffect(() => {
(async () => {
if (user) {
await loadContact();
await loadUserContents();
}
})();
}, []);
useEffect(() => {
(async () => {
if (user) {
await loadContact();
await loadUserContents();
}
})();
}, []);

const loadContact = async () => {
const load = await user.fullContact.contact.load();
const loadContact = async () => {
const load = await user.fullContact.contact.load();

toast({ title: load.message, status: load.success ? 'success' : 'error' });
setContacts(user.fullContact.contact.contacts);
};
toast({title: load.message, status: load.success ? 'success' : 'error'});
setContacts(user.fullContact.contact.contacts);
};

const loadUserContents = async () => {
const loadShared = await user.drive.loadShared(user.fullContact.contact.contacts);
toast({ title: loadShared.message, status: loadShared.success ? 'success' : 'error' });
setFiles(user.drive.files);
setFolders(user.drive.folders);
setSharedFiles(user.drive.sharedFiles);
setSharedPrograms(user.drive.sharedPrograms);
const loadUserContents = async () => {
const loadShared = await user.drive.loadShared(user.fullContact.contact.contacts);
toast({title: loadShared.message, status: loadShared.success ? 'success' : 'error'});
setFiles(user.drive.files);
setFolders(user.drive.folders);
setSharedFiles(user.drive.sharedFiles);
setSharedPrograms(user.drive.sharedPrograms);

const loadedPrograms = await user.fullContact.computing.load();
toast({ title: loadedPrograms.message, status: loadedPrograms.success ? 'success' : 'error' });
setPrograms(user.fullContact.computing.programs);
const loadedPrograms = await user.fullContact.computing.load();
toast({title: loadedPrograms.message, status: loadedPrograms.success ? 'success' : 'error'});
setPrograms(user.fullContact.computing.programs);

const loadedConfig = await user.loadConfig();
setConfig(user.config);
if (user.config?.theme.value === 'white' && colorMode !== 'light') toggleColorMode();
if (user.config?.theme.value === 'gray.800' && colorMode !== 'dark') toggleColorMode();
toast({ title: loadedConfig.message, status: loadedConfig.success ? 'success' : 'error' });
};
const loadedConfig = await user.loadConfig();
setConfig(user.config);
if (user.config?.theme.value === 'white' && colorMode !== 'light') toggleColorMode();
if (user.config?.theme.value === 'gray.800' && colorMode !== 'dark') toggleColorMode();
toast({title: loadedConfig.message, status: loadedConfig.success ? 'success' : 'error'});
};

return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="My drive" />
<DriveCards
files={files.filter((elem) => elem.path === path && !elem.deletedAt)}
folders={folders.filter((elem) => elem.path === path)}
/>
</VStack>
</Navigation>
);
return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="My drive"/>
<DriveCards
files={files.filter((elem) => elem.path === path && !elem.deletedAt)}
folders={folders.filter((elem) => elem.path === path)}
/>
</VStack>
</Navigation>
);
};

export default Dashboard;
28 changes: 14 additions & 14 deletions pages/drive/programs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
import { VStack } from '@chakra-ui/react';
import {VStack} from '@chakra-ui/react';

import DriveCards from 'components/cards/DriveCards';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import DriveCards from 'components/Models/cards/DriveCards';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

import { useDriveContext } from 'contexts/drive';
import {useDriveContext} from 'contexts/drive';

const Programs = (): JSX.Element => {
const { programs } = useDriveContext();
const {programs} = useDriveContext();

return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="My programs" />
<DriveCards programs={programs} />
</VStack>
</Navigation>
);
return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="My programs"/>
<DriveCards programs={programs}/>
</VStack>
</Navigation>
);
};

export default Programs;
30 changes: 15 additions & 15 deletions pages/drive/shared.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
import { VStack } from '@chakra-ui/react';
import {VStack} from '@chakra-ui/react';

import DriveCards from 'components/cards/DriveCards';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import DriveCards from 'components/Models/cards/DriveCards';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

import { useDriveContext } from 'contexts/drive';
import {useDriveContext} from 'contexts/drive';

const Shared = (): JSX.Element => {
const { sharedFiles } = useDriveContext();
const { sharedPrograms } = useDriveContext();
const {sharedFiles} = useDriveContext();
const {sharedPrograms} = useDriveContext();

return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="Share with me" />
<DriveCards files={sharedFiles.filter((elem) => !elem.deletedAt)} programs={sharedPrograms} />
</VStack>
</Navigation>
);
return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<LabelBadge label="Share with me"/>
<DriveCards files={sharedFiles.filter((elem) => !elem.deletedAt)} programs={sharedPrograms}/>
</VStack>
</Navigation>
);
};

export default Shared;
38 changes: 19 additions & 19 deletions pages/drive/trash.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
import { HStack, VStack } from '@chakra-ui/react';
import {HStack, VStack} from '@chakra-ui/react';

import DriveCards from 'components/cards/DriveCards';
import DriveCards from 'components/Models/cards/DriveCards';
import DeleteBin from 'components/file/DeleteBin';
import LabelBadge from 'components/LabelBadge';
import Navigation from 'components/navigation/Navigation';
import LabelBadge from 'components/Models/LabelBadge';
import Navigation from 'components/Pages/navigation/Navigation';

import { useDriveContext } from 'contexts/drive';
import {useDriveContext} from 'contexts/drive';

const Trash = (): JSX.Element => {
const { path, files, folders, sharedFiles } = useDriveContext();
const {path, files, folders, sharedFiles} = useDriveContext();

const deletedFiles = files.filter((elem) => elem.path === path && elem.deletedAt !== null);
const deletedFolders = folders.filter((elem) => elem.path === path);
const deletedFiles = files.filter((elem) => elem.path === path && elem.deletedAt !== null);
const deletedFolders = folders.filter((elem) => elem.path === path);

return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<HStack spacing="48px">
<LabelBadge label="Trash" />
<DeleteBin files={deletedFiles} folders={deletedFolders} concernedFiles={sharedFiles} />
</HStack>
<DriveCards files={deletedFiles} folders={deletedFolders} />
</VStack>
</Navigation>
);
return (
<Navigation>
<VStack w="100%" spacing="48px" align="start">
<HStack spacing="48px">
<LabelBadge label="Trash"/>
<DeleteBin files={deletedFiles} folders={deletedFolders} concernedFiles={sharedFiles}/>
</HStack>
<DriveCards files={deletedFiles} folders={deletedFolders}/>
</VStack>
</Navigation>
);
};

export default Trash;
Loading