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.

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

style(datatrakWeb): RN-1453: Mobile survey workflow #5981

Merged
merged 38 commits into from
Nov 24, 2024
Merged
Changes from 1 commit
Commits
Show all changes
38 commits
Select commit Hold shift + click to select a range
af46ec1
mobile survey header
tcaiger Oct 11, 2024
a02014e
custom icons
tcaiger Oct 11, 2024
adfccb7
Update SurveyMobilePaginator.tsx
tcaiger Oct 11, 2024
6de4c26
Merge branch 'dev' into rn-1453-survey-workflow
tcaiger Oct 24, 2024
34860e8
Merge branch 'rn-1448-responsive-dashboard' into rn-1453-survey-workflow
tcaiger Oct 24, 2024
7da7e7f
wip
tcaiger Oct 25, 2024
1916393
fix(tupaiaWeb): RN-1512: Fix broken arithmetic visuals (#5980)
tcaiger Oct 31, 2024
a313a60
survey select page
tcaiger Nov 1, 2024
1fc1638
Merge branch 'dev' into rn-1453-survey-workflow
tcaiger Nov 3, 2024
0f5ef43
country selector
tcaiger Nov 3, 2024
10b11cb
side menu
tcaiger Nov 3, 2024
eba85fa
db(entityTypes): MAUI-4763: Add new entity types (pacmossi_insecticid…
hrazasalman Nov 4, 2024
8361dd6
copy and share
tcaiger Nov 4, 2024
34bf7b6
header style
tcaiger Nov 4, 2024
10ceb6d
Update dataTables.js
tcaiger Nov 4, 2024
d662929
sticky header
tcaiger Nov 4, 2024
e294a80
tweak styles
tcaiger Nov 4, 2024
135da5f
style tweaks
tcaiger Nov 4, 2024
1fc4514
Update ResultsList.tsx
tcaiger Nov 4, 2024
db9e40a
Merge pull request #5985 from beyondessential/release-2024-45
tcaiger Nov 4, 2024
8b2e1c0
refactor list
tcaiger Nov 4, 2024
6ab99ec
select list
tcaiger Nov 5, 2024
d84b74f
mobile menu
tcaiger Nov 6, 2024
7279b00
toast styles
tcaiger Nov 7, 2024
04ed541
fix(datatrak): RN-1450: Fix mobile tooltips (#5971)
tcaiger Nov 7, 2024
86956ea
Merge branch 'rn-1448-responsive-dashboard' into rn-1453-survey-workflow
tcaiger Nov 7, 2024
3a2a38c
Merge branch 'rn-1452-survey-select' into rn-1453-survey-workflow
tcaiger Nov 7, 2024
2ad2de9
Update index.ts
tcaiger Nov 7, 2024
22b4cca
tweaks
tcaiger Nov 7, 2024
32fa9e1
Merge branch 'rn-1452-survey-select' into rn-1453-survey-workflow
tcaiger Nov 7, 2024
8d4fa8e
Merge branch 'rn-1452-survey-select' into rn-1453-survey-workflow
tcaiger Nov 7, 2024
1b959cf
Merge pull request #5990 from beyondessential/merge-2024-45
tcaiger Nov 7, 2024
e25ccc8
pr suggestions
tcaiger Nov 12, 2024
2c91fdd
Update CancelConfirmModal.tsx
tcaiger Nov 20, 2024
5438c07
tweak(datatrak): RN-1451: DataTrak request country access form (#6000)
tcaiger Nov 22, 2024
ec216e2
tweak(adminPanel): RN-1419: Don't delete survey screens and component…
alexd-bes Nov 22, 2024
cfda04f
Merge branch 'dev' into rn-1453-survey-workflow
tcaiger Nov 22, 2024
a52bb35
Update SurveyDisplayName.tsx
tcaiger Nov 22, 2024
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
Prev Previous commit
Next Next commit
side menu
tcaiger committed Nov 3, 2024
commit 10b11cb191561b94316f20917ab1745f88e8ee24
Original file line number Diff line number Diff line change
@@ -72,6 +72,7 @@ export const MobileSurveyHeader = () => {
const surveyName = getDisplaySurveyName();
const countryName = country?.name || '';

// Todo" Re-use Sticky header component
return (
<>
<Container>
Original file line number Diff line number Diff line change
@@ -9,7 +9,6 @@ import { KeyboardArrowRight } from '@material-ui/icons';
import { IconButton as MuiIconButton } from '@material-ui/core';
import { useSurveyForm } from '../SurveyContext';
import { Button as UIButton, CopyIcon, ShareIcon, ContentsIcon } from '../../../components';
import { useIsMobile } from '../../../utils';

const Container = styled.div`
display: flex;
@@ -35,36 +34,29 @@ const Button = styled(UIButton).attrs({
border-left: 1px solid ${props => props.theme.palette.divider};
`;

export const SurveyMobilePaginator = () => {
const { isLast, isReviewScreen, isResubmitReviewScreen } = useSurveyForm();
const isMobile = useIsMobile();
export const MobileSurveyMenu = () => {
const { toggleSideMenu, isLast, isReviewScreen, isResubmitReviewScreen } = useSurveyForm();

const getNextButtonText = () => {
if (isReviewScreen) return 'Submit';
if (isResubmitReviewScreen) return 'Resubmit';
if (isLast) {
return isMobile ? 'Review' : 'Review and submit';
return 'Review';
}
return 'Next';
};

const nextButtonText = getNextButtonText();

const handleShare = () => {
console.log('Share');
};

const handleMenuOpen = () => {
console.log('Menu Open');
};

const handleCopy = () => {
console.log('Copy');
};

return (
<Container>
<IconButton onClick={handleMenuOpen}>
<IconButton onClick={toggleSideMenu}>
<ContentsIcon />
</IconButton>
<IconButton onClick={handleShare}>
@@ -73,7 +65,7 @@ export const SurveyMobilePaginator = () => {
<IconButton onClick={handleCopy}>
<CopyIcon />
</IconButton>
<Button type="submit">{nextButtonText}</Button>
<Button type="submit">{getNextButtonText()}</Button>
</Container>
);
};
Original file line number Diff line number Diff line change
@@ -131,7 +131,7 @@ export const SurveySideMenu = () => {

return (
<>
<SideMenuButton />
{!isMobile && <SideMenuButton />}
<Drawer
open={sideMenuOpen}
onClose={toggleSideMenu}
Original file line number Diff line number Diff line change
@@ -10,5 +10,5 @@ export { MobileSurveyHeader } from './MobileSurveyHeader';
export * from './SurveySideMenu';
export { SurveyReviewSection } from './SurveyReviewSection';
export { SurveyPaginator } from './SurveyPaginator';
export { SurveyMobilePaginator } from './SurveyMobilePaginator';
export { MobileSurveyMenu } from './MobileSurveyMenu.tsx';
export { SurveySuccess } from './SurveySuccess';
Original file line number Diff line number Diff line change
@@ -12,7 +12,7 @@ import {
SurveyPaginator,
SurveyQuestionGroup,
MobileSurveyHeader,
SurveyMobilePaginator,
MobileSurveyMenu,
} from '../Components';
import { ScrollableBody } from '../../../layout';
import { useIsMobile } from '../../../utils';
@@ -41,11 +41,6 @@ const Heading = styled(Typography).attrs({ variant: 'h2' })`
}
`;

const SurveyThumbMenu = () => {
const isMobile = useIsMobile();
return isMobile ? <SurveyMobilePaginator /> : <SurveyPaginator />;
};

/**
* This is the component that renders survey questions.
*/
@@ -82,7 +77,7 @@ export const SurveyScreen = () => {
</ScreenHeader>
<SurveyQuestionGroup questions={displayQuestions} />
</ScrollableBody>
<SurveyThumbMenu />
{isMobile ? <MobileSurveyMenu /> : <SurveyPaginator />}
</>
);
};
4 changes: 1 addition & 3 deletions packages/datatrak-web/src/features/Survey/SurveyLayout.tsx
Original file line number Diff line number Diff line change
@@ -17,7 +17,6 @@ import { useFromLocation } from '../../utils';
import { useSurveyForm } from './SurveyContext';
import { SIDE_MENU_WIDTH, SurveySideMenu } from './Components';
import { getErrorsByScreen } from './utils';
import { useIsMobile } from '../../utils';
import { useSurveyRouting } from './useSurveyRouting';

const ScrollableLayout = styled.div<{
@@ -79,7 +78,6 @@ export const SurveyLayout = () => {
const from = useFromLocation();
const params = useParams<SurveyParams>();
const isFetchingEntities = useIsFetching({ queryKey: ['entityAncestors'] });
const isMobile = useIsMobile();

const {
updateFormData,
@@ -160,7 +158,7 @@ export const SurveyLayout = () => {

return (
<>
{!isMobile ? <SurveySideMenu /> : null}
<SurveySideMenu />
<ScrollableLayout $sideMenuClosed={!sideMenuOpen && !isReviewScreen && !isResponseScreen}>
<Paper>
<Form onSubmit={handleClickSubmit} noValidate>