More work on todo list support
This commit is contained in:
@ -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 (
|
||||
|
@ -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);
|
||||
}}
|
||||
|
@ -34,6 +34,7 @@ export const EditReminder = ({ reminder: initialReminder, globalCollapse }: Prop
|
||||
id={`reminder-${reminder.uid.slice(0, 12)}`}
|
||||
>
|
||||
<TopBar
|
||||
isCreating={false}
|
||||
toggleCollapsed={() => {
|
||||
setCollapsed(!collapsed);
|
||||
}}
|
||||
|
@ -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>
|
||||
|
@ -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} />;
|
||||
}
|
||||
|
Reference in New Issue
Block a user