mirror of
https://github.com/lukevella/rallly.git
synced 2025-07-31 06:59:07 +02:00
💄 Improve handling of hidden participants
This commit is contained in:
parent
dcb7157b86
commit
a9c4f7e52d
2 changed files with 11 additions and 4 deletions
|
@ -29,7 +29,10 @@ import { useVotingForm } from "@/components/poll/voting-form";
|
||||||
import { usePermissions } from "@/contexts/permissions";
|
import { usePermissions } from "@/contexts/permissions";
|
||||||
import { usePoll } from "@/contexts/poll";
|
import { usePoll } from "@/contexts/poll";
|
||||||
|
|
||||||
import { useVisibleParticipants } from "../participants-provider";
|
import {
|
||||||
|
useParticipants,
|
||||||
|
useVisibleParticipants,
|
||||||
|
} from "../participants-provider";
|
||||||
import ParticipantRow from "./desktop-poll/participant-row";
|
import ParticipantRow from "./desktop-poll/participant-row";
|
||||||
import ParticipantRowForm from "./desktop-poll/participant-row-form";
|
import ParticipantRowForm from "./desktop-poll/participant-row-form";
|
||||||
import PollHeader from "./desktop-poll/poll-header";
|
import PollHeader from "./desktop-poll/poll-header";
|
||||||
|
@ -99,6 +102,7 @@ const DesktopPoll: React.FunctionComponent = () => {
|
||||||
const votingForm = useVotingForm();
|
const votingForm = useVotingForm();
|
||||||
const mode = votingForm.watch("mode");
|
const mode = votingForm.watch("mode");
|
||||||
|
|
||||||
|
const { participants } = useParticipants();
|
||||||
const visibleParticipants = useVisibleParticipants();
|
const visibleParticipants = useVisibleParticipants();
|
||||||
|
|
||||||
const scrollRef = React.useRef<HTMLDivElement>(null);
|
const scrollRef = React.useRef<HTMLDivElement>(null);
|
||||||
|
@ -228,7 +232,7 @@ const DesktopPoll: React.FunctionComponent = () => {
|
||||||
<CardTitle>
|
<CardTitle>
|
||||||
<Trans i18nKey="participants" />
|
<Trans i18nKey="participants" />
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<Badge>{visibleParticipants.length}</Badge>
|
<Badge>{participants.length}</Badge>
|
||||||
{canAddNewParticipant && mode !== "new" ? (
|
{canAddNewParticipant && mode !== "new" ? (
|
||||||
<Button
|
<Button
|
||||||
className="ml-2"
|
className="ml-2"
|
||||||
|
@ -251,7 +255,7 @@ const DesktopPoll: React.FunctionComponent = () => {
|
||||||
<TimesShownIn />
|
<TimesShownIn />
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
) : null}
|
) : null}
|
||||||
{visibleParticipants.length > 0 || mode !== "view" ? (
|
{participants.length > 0 || mode !== "view" ? (
|
||||||
<div className="relative flex min-h-0 flex-col">
|
<div className="relative flex min-h-0 flex-col">
|
||||||
<div
|
<div
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
|
|
@ -6,6 +6,7 @@ import { DateIconInner } from "@/components/date-icon";
|
||||||
import { ParticipantAvatarBar } from "@/components/participant-avatar-bar";
|
import { ParticipantAvatarBar } from "@/components/participant-avatar-bar";
|
||||||
import { useParticipants } from "@/components/participants-provider";
|
import { useParticipants } from "@/components/participants-provider";
|
||||||
import { Trans } from "@/components/trans";
|
import { Trans } from "@/components/trans";
|
||||||
|
import { IfParticipantsVisible } from "@/components/visibility";
|
||||||
import { usePoll } from "@/contexts/poll";
|
import { usePoll } from "@/contexts/poll";
|
||||||
import { useDayjs } from "@/utils/dayjs";
|
import { useDayjs } from "@/utils/dayjs";
|
||||||
|
|
||||||
|
@ -71,7 +72,9 @@ export function ScheduledEvent() {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<Attendees />
|
<IfParticipantsVisible>
|
||||||
|
<Attendees />
|
||||||
|
</IfParticipantsVisible>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue