Convert files in themes/ services/ contexts/ to TS
Convert all Javascript files in `client/src/themes`, `client/src/service`, `client/src/contexts` to Typescript.
Convert SvgIcon, Input, ConversationView, Button components to Typescript
Gitlab #30
Change-Id: I0d0505c28e21c771906edf8d5e7b8ce36126fa64
diff --git a/client/src/themes/ThemeDemonstrator.tsx b/client/src/themes/ThemeDemonstrator.tsx
new file mode 100644
index 0000000..977deed
--- /dev/null
+++ b/client/src/themes/ThemeDemonstrator.tsx
@@ -0,0 +1,66 @@
+import { Button, Stack, Switch, ThemeProvider, Typography } from '@mui/material';
+
+import {
+ BackButton,
+ CancelPictureButton,
+ CloseButton,
+ EditPictureButton,
+ InfoButton,
+ TakePictureButton,
+ TipButton,
+ UploadPictureButton,
+} from '../components/Button';
+import { NickNameInput, PasswordInput, RegularInput, UsernameInput } from '../components/Input';
+import defaultTheme from './Default';
+
+export const ThemeDemonstrator = () => {
+ return (
+ <ThemeProvider theme={defaultTheme}>
+ <Stack spacing="5px">
+ <Stack>
+ <Typography variant="h1">Exemple de titre H1</Typography>
+ <Typography variant="h2">Exemple de titre H2</Typography>
+ <Typography variant="h3">Exemple de titre H3</Typography>
+ <Typography variant="h4">Exemple de titre H4</Typography>
+ <Typography variant="h5">Exemple de titre H5</Typography>
+ <Typography variant="body1">Texte courant principal</Typography>
+ <Typography variant="body2">Texte courant secondaire</Typography>
+ <Typography variant="caption">Légendes et annotations</Typography>
+ </Stack>
+ <Stack spacing="5px" padding="5px" width="300px">
+ <Button variant="contained">Bouton primaire</Button>
+ <Button variant="outlined">Bouton secondaire</Button>
+ <Button variant="text">Bouton tertiaire</Button>
+ <Button variant="contained" size="small">
+ Bouton liste préférences
+ </Button>
+ </Stack>
+ <Stack direction="row" spacing="5px">
+ <CancelPictureButton />
+ <EditPictureButton />
+ <UploadPictureButton />
+ <TakePictureButton />
+ </Stack>
+ <Stack direction="row" spacing="5px">
+ <InfoButton />
+ <TipButton />
+ </Stack>
+ <Stack direction="row" spacing="5px">
+ <BackButton />
+ <CloseButton />
+ </Stack>
+ <Stack>
+ <Switch />
+ </Stack>
+ <Stack padding="5px" width="300px">
+ <UsernameInput />
+ <UsernameInput error defaultValue="Cyrille" />
+ <PasswordInput />
+ <PasswordInput error defaultValue="SavoirFaireLinux" />
+ <NickNameInput />
+ <RegularInput />
+ </Stack>
+ </Stack>
+ </ThemeProvider>
+ );
+};