Skip to content

Commit

Permalink
fix: allow qr code access from all users (#1023)
Browse files Browse the repository at this point in the history 
* feat (projectDetails): geolocation - capacitor geolocation & motion integrated for device position & orientation

* feat (vectorLayer): geolocationImage - rotate image when device orientation changes

* fix (projectDetails): mapControlComponent - relplaced navigator geolocation with capacitor geolocation

* pnpm - pnpm file updated

* fix (projectDetails): qrCodeComponent - qrcode only visible if the user itself has started mapping that task
  • Loading branch information
@NSUWAL123
NSUWAL123 authored Dec 4, 2023
1 parent 74dbe0d commit acf9995
Showing 1 changed file with 85 additions and 72 deletions.
157 changes: 85 additions & 72 deletions src/frontend/src/components/QrcodeComponent.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,17 @@ const TasksComponent = ({ type, task, defaultTheme }) => {
const dispatch = CoreModules.useAppDispatch();
const [open, setOpen] = useState(false);
const params = CoreModules.useParams();
const projectData = CoreModules.useAppSelector((state) => state.project.projectTaskBoundries);
const currentProjectId = environment.decode(params.id);
const projectIndex = projectData.findIndex((project) => project.id == currentProjectId);
const token = CoreModules.useAppSelector((state) => state.login.loginToken);
const currentStatus = {
...projectData?.[projectIndex]?.taskBoundries?.filter((indTask, i) => {
return indTask.id == task;
})?.[0],
};
const checkIfTaskAssignedOrNot =
currentStatus?.locked_by_username === token?.username || currentStatus?.locked_by_username === null;

const { loading, qrcode } = ProjectFilesById(
`${import.meta.env.VITE_API_URL}/tasks/task-list?project_id=${environment.decode(params.id)}`,
Expand All @@ -31,81 +42,82 @@ const TasksComponent = ({ type, task, defaultTheme }) => {

return (
<CoreModules.Stack>
<CoreModules.Stack direction={type == 's' ? 'column' : type == 'xs' ? 'column' : 'row'} spacing={2} mt={'1%'}>
<BasicCard
subtitle={{}}
contentProps={{}}
variant={'elevation'}
headerStatus={true}
content={
<CoreModules.Stack direction={'column'} justifyContent={'center'}>
<CoreModules.Stack direction={'row'} justifyContent={'center'}>
<CoreModules.Typography variant="h2">{`Qrcode`}</CoreModules.Typography>
</CoreModules.Stack>
{checkIfTaskAssignedOrNot && (
<CoreModules.Stack direction={type == 's' ? 'column' : type == 'xs' ? 'column' : 'row'} spacing={2} mt={'1%'}>
<BasicCard
subtitle={{}}
contentProps={{}}
variant={'elevation'}
headerStatus={true}
content={
<CoreModules.Stack direction={'column'} justifyContent={'center'}>
<CoreModules.Stack direction={'row'} justifyContent={'center'}>
<CoreModules.Typography variant="h2">{`Qrcode`}</CoreModules.Typography>
</CoreModules.Stack>

<CoreModules.Stack direction={'row'} justifyContent={'center'}>
{qrcode == '' ? (
<CoreModules.Stack>
<CoreModules.SkeletonTheme
baseColor={defaultTheme.palette.loading['skeleton_rgb']}
highlightColor={defaultTheme.palette.loading['skeleton_rgb']}
<CoreModules.Stack direction={'row'} justifyContent={'center'}>
{qrcode == '' ? (
<CoreModules.Stack>
<CoreModules.SkeletonTheme
baseColor={defaultTheme.palette.loading['skeleton_rgb']}
highlightColor={defaultTheme.palette.loading['skeleton_rgb']}
>
<CoreModules.Skeleton width={170} count={7} />
</CoreModules.SkeletonTheme>
</CoreModules.Stack>
) : (
<img id="qrcodeImg" src={`data:image/png;base64,${qrcode}`} alt="qrcode" />
)}
</CoreModules.Stack>

<CoreModules.Stack mt={'1.5%'} direction={'row'} justifyContent={'center'} spacing={5}>
<CoreModules.Stack width={40} height={40} borderRadius={55} boxShadow={2} justifyContent={'center'}>
<CoreModules.IconButton
onClick={() => {
const linkSource = `data:image/png;base64,${qrcode}`;
const downloadLink = document.createElement('a');
downloadLink.href = linkSource;
downloadLink.download = `Task_${task}`;
downloadLink.click();
}}
disabled={qrcode == '' ? true : false}
color="info"
aria-label="download qrcode"
>
<CoreModules.Skeleton width={170} count={7} />
</CoreModules.SkeletonTheme>
<AssetModules.FileDownloadIcon sx={{ fontSize: defaultTheme.typography.fontSize }} />
</CoreModules.IconButton>
</CoreModules.Stack>
) : (
<img id="qrcodeImg" src={`data:image/png;base64,${qrcode}`} alt="qrcode" />
)}
</CoreModules.Stack>

<CoreModules.Stack mt={'1.5%'} direction={'row'} justifyContent={'center'} spacing={5}>
<CoreModules.Stack width={40} height={40} borderRadius={55} boxShadow={2} justifyContent={'center'}>
<CoreModules.IconButton
<CoreModules.Button
variant="contained"
color="error"
onClick={() => {
const linkSource = `data:image/png;base64,${qrcode}`;
const downloadLink = document.createElement('a');
downloadLink.href = linkSource;
downloadLink.download = `Task_${task}`;
downloadLink.click();
document.location.href =
'intent://getodk.org/#Intent;scheme=app;package=org.odk.collect.android;end';
}}
disabled={qrcode == '' ? true : false}
color="info"
aria-label="download qrcode"
>
<AssetModules.FileDownloadIcon sx={{ fontSize: defaultTheme.typography.fontSize }} />
</CoreModules.IconButton>
</CoreModules.Stack>
<CoreModules.Button
variant="contained"
color="error"
onClick={() => {
document.location.href =
'intent://getodk.org/#Intent;scheme=app;package=org.odk.collect.android;end';
}}
>
Go To ODK
</CoreModules.Button>
<CoreModules.Stack width={40} height={40} borderRadius={55} boxShadow={2} justifyContent={'center'}>
<CoreModules.IconButton
onClick={() => {
dispatch(
HomeActions.SetSnackBar({
open: true,
message: `not implemented`,
variant: 'warning',
duration: 3000,
}),
);
// setOpen(true);
}}
disabled={qrcode == '' ? true : false}
color="info"
aria-label="share qrcode"
>
<AssetModules.ShareIcon sx={{ fontSize: defaultTheme.typography.fontSize }} />
</CoreModules.IconButton>
Go To ODK
</CoreModules.Button>
<CoreModules.Stack width={40} height={40} borderRadius={55} boxShadow={2} justifyContent={'center'}>
<CoreModules.IconButton
onClick={() => {
dispatch(
HomeActions.SetSnackBar({
open: true,
message: `not implemented`,
variant: 'warning',
duration: 3000,
}),
);
// setOpen(true);
}}
disabled={qrcode == '' ? true : false}
color="info"
aria-label="share qrcode"
>
<AssetModules.ShareIcon sx={{ fontSize: defaultTheme.typography.fontSize }} />
</CoreModules.IconButton>

{/* <BasicDialog
{/* <BasicDialog
title={"Share with"}
actions={
<ShareSocial
Expand All @@ -120,12 +132,13 @@ const TasksComponent = ({ type, task, defaultTheme }) => {
}}
open={open}
/> */}
</CoreModules.Stack>
</CoreModules.Stack>
</CoreModules.Stack>
</CoreModules.Stack>
}
/>
</CoreModules.Stack>
}
/>
</CoreModules.Stack>
)}
</CoreModules.Stack>
);
};
Expand Down

0 comments on commit acf9995

Please sign in to comment.