a tool for shared writing and social publishing
moved poll options in poll
+103
-62
+103
-62
components/Blocks/PollBlock.tsx
+103
-62
components/Blocks/PollBlock.tsx
···
75
75
}}
76
76
/>
77
77
) : pollState === "results" ? (
78
-
<PollResults entityID={props.entityID} />
78
+
<PollResults
79
+
entityID={props.entityID}
80
+
pollState={pollState}
81
+
setPollState={setPollState}
82
+
hasVoted={!!hasVoted}
83
+
/>
79
84
) : (
80
85
<PollVote
81
86
entityID={props.entityID}
82
87
onSubmit={() => setPollState("results")}
88
+
pollState={pollState}
89
+
setPollState={setPollState}
90
+
hasVoted={!!hasVoted}
83
91
/>
84
92
)}
85
-
86
-
{pollState !== "editing" && (
87
-
<div className="flex justify-end gap-2">
88
-
{permissions.write && (
89
-
<button
90
-
className="pollEditOptions w-fit flex gap-2 items-center justify-start text-sm text-accent-contrast"
91
-
onClick={() => {
92
-
setPollState("editing");
93
-
}}
94
-
>
95
-
Edit Options{" "}
96
-
</button>
97
-
)}
98
-
99
-
{permissions.write && <Separator classname="h-6" />}
100
-
<PollStateToggle
101
-
setPollState={setPollState}
102
-
pollState={pollState}
103
-
hasVoted={!!hasVoted}
104
-
/>
105
-
</div>
106
-
)}
107
93
</div>
108
94
);
109
95
};
110
96
111
-
const PollVote = (props: { entityID: string; onSubmit: () => void }) => {
97
+
const PollVote = (props: {
98
+
entityID: string;
99
+
onSubmit: () => void;
100
+
pollState: "editing" | "voting" | "results";
101
+
setPollState: (pollState: "editing" | "voting" | "results") => void;
102
+
hasVoted: boolean;
103
+
}) => {
112
104
let { data, mutate } = usePollData();
105
+
let { permissions } = useEntitySetContext();
106
+
113
107
let pollOptions = useEntity(props.entityID, "poll/options");
114
108
let currentVotes = data?.voter_token
115
109
? data.polls
···
139
133
entityID={option.data.value}
140
134
/>
141
135
))}
142
-
<ButtonPrimary
143
-
className="place-self-end"
144
-
onClick={async () => {
145
-
await voteOnPoll(props.entityID, selectedPollOptions);
146
-
mutate((oldState) => {
147
-
if (!oldState || !oldState.voter_token) return;
148
-
return {
149
-
...oldState,
150
-
polls: [
151
-
...oldState.polls.filter(
152
-
(p) =>
153
-
!(
154
-
p.poll_votes_on_entity.voter_token ===
155
-
oldState.voter_token &&
156
-
p.poll_votes_on_entity.poll_entity == props.entityID
157
-
),
158
-
),
159
-
...selectedPollOptions.map((option_entity) => ({
160
-
poll_votes_on_entity: {
161
-
option_entity,
162
-
poll_entity: props.entityID,
163
-
voter_token: oldState.voter_token!,
164
-
},
165
-
})),
166
-
],
167
-
};
168
-
});
169
-
props.onSubmit();
170
-
}}
171
-
disabled={
172
-
selectedPollOptions.length === 0 ||
173
-
(selectedPollOptions.length === currentVotes.length &&
174
-
selectedPollOptions.every((s) => currentVotes.includes(s)))
175
-
}
176
-
>
177
-
Vote!
178
-
</ButtonPrimary>
136
+
<div className="flex justify-between items-center">
137
+
<div className="flex justify-end gap-2">
138
+
{permissions.write && (
139
+
<button
140
+
className="pollEditOptions w-fit flex gap-2 items-center justify-start text-sm text-accent-contrast"
141
+
onClick={() => {
142
+
props.setPollState("editing");
143
+
}}
144
+
>
145
+
Edit Options
146
+
</button>
147
+
)}
148
+
149
+
{permissions.write && <Separator classname="h-6" />}
150
+
<PollStateToggle
151
+
setPollState={props.setPollState}
152
+
pollState={props.pollState}
153
+
hasVoted={props.hasVoted}
154
+
/>
155
+
</div>
156
+
<ButtonPrimary
157
+
className="place-self-end"
158
+
onClick={async () => {
159
+
await voteOnPoll(props.entityID, selectedPollOptions);
160
+
mutate((oldState) => {
161
+
if (!oldState || !oldState.voter_token) return;
162
+
return {
163
+
...oldState,
164
+
polls: [
165
+
...oldState.polls.filter(
166
+
(p) =>
167
+
!(
168
+
p.poll_votes_on_entity.voter_token ===
169
+
oldState.voter_token &&
170
+
p.poll_votes_on_entity.poll_entity == props.entityID
171
+
),
172
+
),
173
+
...selectedPollOptions.map((option_entity) => ({
174
+
poll_votes_on_entity: {
175
+
option_entity,
176
+
poll_entity: props.entityID,
177
+
voter_token: oldState.voter_token!,
178
+
},
179
+
})),
180
+
],
181
+
};
182
+
});
183
+
props.onSubmit();
184
+
}}
185
+
disabled={
186
+
selectedPollOptions.length === 0 ||
187
+
(selectedPollOptions.length === currentVotes.length &&
188
+
selectedPollOptions.every((s) => currentVotes.includes(s)))
189
+
}
190
+
>
191
+
Vote!
192
+
</ButtonPrimary>
193
+
</div>
179
194
</>
180
195
);
181
196
};
···
213
228
);
214
229
};
215
230
216
-
const PollResults = (props: { entityID: string }) => {
231
+
const PollResults = (props: {
232
+
entityID: string;
233
+
pollState: "editing" | "voting" | "results";
234
+
setPollState: (pollState: "editing" | "voting" | "results") => void;
235
+
hasVoted: boolean;
236
+
}) => {
217
237
let { data } = usePollData();
238
+
let { permissions } = useEntitySetContext();
218
239
let pollOptions = useEntity(props.entityID, "poll/options");
219
240
let pollData = data?.pollVotes.find((p) => p.poll_entity === props.entityID);
220
241
let votesByOptions = pollData?.votesByOption || {};
···
237
258
votes={pollData?.votesByOption[p.data.value] || 0}
238
259
/>
239
260
))}
261
+
<div className="flex gap-2">
262
+
{permissions.write && (
263
+
<button
264
+
className="pollEditOptions w-fit flex gap-2 items-center justify-start text-sm text-accent-contrast"
265
+
onClick={() => {
266
+
props.setPollState("editing");
267
+
}}
268
+
>
269
+
Edit Options
270
+
</button>
271
+
)}
272
+
273
+
{permissions.write && <Separator classname="h-6" />}
274
+
<PollStateToggle
275
+
setPollState={props.setPollState}
276
+
pollState={props.pollState}
277
+
hasVoted={props.hasVoted}
278
+
/>
279
+
</div>
240
280
</>
241
281
);
242
282
};
···
309
349
)}
310
350
{pollOptions.map((p) => (
311
351
<EditPollOption
352
+
key={p.id}
312
353
entityID={p.data.value}
313
354
pollEntity={props.entityID}
314
355
disabled={!!props.votes.find((v) => v.option_entity === p.data.value)}