More work on todo list support

This commit is contained in:
jude
2024-04-07 20:20:16 +01:00
parent 9989ab3b35
commit e128b9848f
20 changed files with 317 additions and 172 deletions

View File

@ -1,9 +1,9 @@
import { useQuery } from "react-query";
import { useParams } from "wouter";
import { fetchGuildChannels } from "../../api";
import { useGuild } from "../App/useGuild";
export const ChannelSelector = ({ channel, setChannel }) => {
const { guild } = useParams();
const guild = useGuild();
const { isSuccess, data } = useQuery(fetchGuildChannels(guild));
return (

View File

@ -61,6 +61,7 @@ export const CreateReminder = () => {
<ReminderContext.Provider value={[reminder, setReminder]}>
<div class={collapsed ? "reminderContent is-collapsed" : "reminderContent"}>
<TopBar
isCreating={true}
toggleCollapsed={() => {
setCollapsed(!collapsed);
}}

View File

@ -34,6 +34,7 @@ export const EditReminder = ({ reminder: initialReminder, globalCollapse }: Prop
id={`reminder-${reminder.uid.slice(0, 12)}`}
>
<TopBar
isCreating={false}
toggleCollapsed={() => {
setCollapsed(!collapsed);
}}

View File

@ -6,7 +6,7 @@ import { useCallback } from "preact/hooks";
import { DateTime } from "luxon";
import { Name } from "../Name";
export const Guild = ({ toggleCollapsed }) => {
export const Guild = ({ toggleCollapsed, isCreating }) => {
const guild = useGuild();
const [reminder] = useReminder();
@ -55,7 +55,7 @@ export const Guild = ({ toggleCollapsed }) => {
<div class="columns is-mobile column reminder-topbar">
{isSuccess && <div class="invert-collapses channel-bar">#{channelName(reminder)}</div>}
<Name />
<div class="time-bar">in {string}</div>
{!isCreating && <div class="time-bar">in {string}</div>}
<div class="hide-button-bar">
<button class="button hide-box" onClick={toggleCollapsed}>
<span class="is-sr-only">Hide reminder</span>

View File

@ -2,11 +2,11 @@ import { useGuild } from "../../App/useGuild";
import { Guild } from "./Guild";
import { User } from "./User";
export const TopBar = ({ toggleCollapsed }) => {
export const TopBar = ({ toggleCollapsed, isCreating }) => {
const guild = useGuild();
if (guild) {
return <Guild toggleCollapsed={toggleCollapsed} />;
return <Guild toggleCollapsed={toggleCollapsed} isCreating={isCreating} />;
} else {
return <User toggleCollapsed={toggleCollapsed} />;
}