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

517 protect results page #520

Merged
merged 3 commits into from
May 20, 2024
Merged

517 protect results page #520

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b78f79f
Update back button to recieve a fallback route
camilovegag May 18, 2024
e7ec501
Create a loader to redirect to cycle id if cycle is open (protect /re…
camilovegag May 18, 2024
bdb07db
Add fallback route to cycle back button
camilovegag May 18, 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
18 changes: 18 additions & 0 deletions packages/berlin/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,22 @@ async function redirectToCycleResultsLoader(
return null;
}

/**
* Redirects the user to the cycle page if the cycle is open
*/
async function redirectToCycleIfOpen(queryClient: QueryClient, eventId?: string, cycleId?: string) {
const cycle = await queryClient.fetchQuery({
queryKey: ['cycles', cycleId],
queryFn: () => fetchCycle(cycleId || ''),
});

if (cycle?.status === 'OPEN') {
return redirect(`/events/${eventId}/cycles/${cycleId}`);
}

return null;
}

const router = (queryClient: QueryClient) =>
createBrowserRouter([
{ path: '/popup', element: <PassportPopupRedirect /> },
Expand Down Expand Up @@ -211,6 +227,8 @@ const router = (queryClient: QueryClient) =>
},
{
path: ':cycleId/results',
loader: ({ params }) =>
redirectToCycleIfOpen(queryClient, params.eventId, params.cycleId),
Component: Results,
},
{
Expand Down
19 changes: 16 additions & 3 deletions packages/berlin/src/components/back-button/BackButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,27 @@ import { useNavigate } from 'react-router-dom';
import { useAppStore } from '../../store';
import IconButton from '../icon-button';

function BackButton() {
type BackButtonProps = {
fallbackRoute?: string;
};

function BackButton({ fallbackRoute }: BackButtonProps) {
const navigate = useNavigate();
const theme = useAppStore((state) => state.theme);

const handleBackClick = () => {
if (fallbackRoute) {
navigate(fallbackRoute);
} else {
navigate(-1);
}
};

return (
<IconButton
onClick={() => navigate(-1)}
onClick={handleBackClick}
$color="secondary"
icon={{ src: `/icons/arrow-back-${theme}.svg`, alt: 'Trash icon' }}
icon={{ src: `/icons/arrow-back-${theme}.svg`, alt: 'Back icon' }}
$padding={0}
/>
);
Expand Down
4 changes: 2 additions & 2 deletions packages/berlin/src/pages/Cycle.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ function Cycle() {
const queryClient = useQueryClient();

const { user } = useUser();
const { cycleId } = useParams();
const { eventId, cycleId } = useParams();
const { data: cycle } = useQuery({
queryKey: ['cycles', cycleId],
queryFn: () => fetchCycle(cycleId || ''),
Expand Down Expand Up @@ -268,7 +268,7 @@ function Cycle() {
return (
<FlexColumn $gap="2rem">
<FlexColumn>
<BackButton />
<BackButton fallbackRoute={`/events/${eventId}/cycles`} />
<Title>{currentCycle?.questionTitle}</Title>
<Body>{voteInfo}</Body>
<Body>
Expand Down
Loading