-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
11 changed files
with
276 additions
and
79 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,6 @@ | ||
const waitingMessage = { | ||
pleaseWait: { fr: 'Veuillez patienter ...', en: 'Please wait ...' }, | ||
loading: { fr: 'Chargement ...', en: 'Loading ...' }, | ||
pleaseWait: { fr: 'Veuillez patienter...', en: 'Please wait...' }, | ||
loading: { fr: 'Chargement...', en: 'Loading...' }, | ||
}; | ||
|
||
export default waitingMessage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
import React, { useEffect, useRef } from 'react'; | ||
import { useLocation, useNavigate } from 'react-router-dom'; | ||
import { mount } from 'dramaQueen/DramaIndex'; | ||
import { useQueenListener } from '../utils/hooks/useQueenListener'; | ||
|
||
/** | ||
* Mount Queen to sync data | ||
* @returns {JSX.Element} | ||
* @constructor | ||
*/ | ||
export function QueenPage() { | ||
/** @var {import('react').Ref<HTMLDivElement>} ref */ | ||
const ref = useRef(null); | ||
const location = useLocation(); | ||
|
||
const navigate = useNavigate(); | ||
useQueenListener(navigate); | ||
|
||
const isFirstRunRef = useRef(true); | ||
const unmountRef = useRef(() => {}); | ||
|
||
useEffect(() => { | ||
if (!isFirstRunRef.current) { | ||
return; | ||
} | ||
unmountRef.current = mount({ | ||
mountPoint: ref.current, | ||
initialPathname: location.pathname.replace('', ''), | ||
}); | ||
isFirstRunRef.current = false; | ||
}, [location]); | ||
|
||
useEffect(() => unmountRef.current, []); | ||
|
||
return <div ref={ref} id="drama-queen-mfe" />; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
import Stack from '@mui/material/Stack'; | ||
import { FilledInput } from '@mui/material'; | ||
import { Typography } from '../Typography'; | ||
import React from 'react'; | ||
|
||
/** | ||
* @param {string} value | ||
* @param {(v: string) => void} onChange | ||
* @param {import('@mui/material').FilledInputProps} props | ||
* @constructor | ||
*/ | ||
export function CommentField({ value, onChange, ...props }) { | ||
const maxChar = 999; | ||
const handleChange = e => { | ||
if (e.target.value.length > maxChar) { | ||
return; | ||
} | ||
onChange(e.target.value); | ||
}; | ||
return ( | ||
<Stack gap={1}> | ||
<FilledInput | ||
sx={{ | ||
padding: '0rem', | ||
minWidth: 500, | ||
}} | ||
inputProps={{ | ||
sx: { | ||
padding: '1rem', | ||
}, | ||
}} | ||
minRows={8} | ||
maxRows={8} | ||
value={value} | ||
onChange={handleChange} | ||
variant="filled" | ||
label="Commentaire" | ||
multiline | ||
placeholder="Saisissez un commentaire..." | ||
{...props} | ||
/> | ||
<Typography variant="xs" color="textHint" textAlign="right"> | ||
{value.length}/{maxChar} | ||
</Typography> | ||
</Stack> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import Backdrop from '@mui/material/Backdrop'; | ||
import D from 'i18n'; | ||
import CircularProgress from '@mui/material/CircularProgress'; | ||
import Stack from '@mui/material/Stack'; | ||
import Box from '@mui/material/Box'; | ||
|
||
/** | ||
* @param {string} message | ||
* @constructor | ||
*/ | ||
export function Preloader({ message }) { | ||
return ( | ||
<Backdrop open sx={{ color: '#FFF' }}> | ||
<Stack gap={2} alignItems="center"> | ||
<CircularProgress color="white" size="6em" /> | ||
<Box component="h2" m={0} mt={2}> | ||
{D.pleaseWait} | ||
</Box> | ||
<Box component="h3" m={0} sx={{ opacity: 0.75 }} variant="m" color="textTertiary"> | ||
{message} | ||
</Box> | ||
</Stack> | ||
</Backdrop> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,54 @@ | ||
import Card from '@mui/material/Card'; | ||
import CardContent from '@mui/material/CardContent'; | ||
import { Typography } from '../Typography'; | ||
import D from 'i18n'; | ||
import { Row } from '../Row'; | ||
import Stack from '@mui/material/Stack'; | ||
import { getCommentByType } from '../../utils/functions'; | ||
import React, { useState } from 'react'; | ||
import Button from '@mui/material/Button'; | ||
import CommentIcon from '@mui/icons-material/Comment'; | ||
import { CommentField } from '../Fields/CommentField'; | ||
import { surveyUnitIDBService } from '../../utils/indexeddb/services/surveyUnit-idb-service'; | ||
|
||
/** | ||
* @param {SurveyUnit} surveyUnit | ||
*/ | ||
export function CommentCard({ surveyUnit }) { | ||
const baseComment = getCommentByType('INTERVIEWER', surveyUnit); | ||
const [comment, setComment] = useState(baseComment); | ||
const handleSubmit = e => { | ||
e.preventDefault(); | ||
const comments = [ | ||
{ type: 'MANAGEMENT', value: getCommentByType('MANAGEMENT', surveyUnit) }, | ||
{ type: 'INTERVIEWER', value: comment }, | ||
]; | ||
surveyUnitIDBService.addOrUpdateSU({ | ||
...surveyUnit, | ||
comments: comments, | ||
}); | ||
}; | ||
const canSubmit = comment !== baseComment; | ||
return ( | ||
<> | ||
<Card p={2} elevation={0}> | ||
<CardContent> | ||
<Stack gap={3} component="form" onSubmit={handleSubmit}> | ||
<Row gap={1}> | ||
<CommentIcon fontSize="large" /> | ||
<Typography as="h2" variant="xl" fontWeight={700}> | ||
{D.goToCommentsPage} | ||
</Typography> | ||
</Row> | ||
<Stack gap={2} alignItems="stretch"> | ||
<CommentField value={comment} onChange={setComment} /> | ||
<Button variant="contained" type="submit" disabled={!canSubmit}> | ||
{D.saveButton} | ||
</Button> | ||
</Stack> | ||
</Stack> | ||
</CardContent> | ||
</Card> | ||
</> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.