shellphone.app/app/routes/__app/messages.tsx

45 lines
1.4 KiB
TypeScript
Raw Normal View History

2022-05-21 23:45:13 +00:00
import type { MetaFunction } from "@remix-run/node";
2022-05-19 23:16:38 +00:00
import { useLoaderData } from "superjson-remix";
2022-05-20 00:45:07 +00:00
import { atom, useAtom } from "jotai";
2022-05-14 10:22:06 +00:00
2022-05-19 23:16:38 +00:00
import messagesLoader, { type MessagesLoaderData } from "~/features/messages/loaders/messages";
2022-05-14 10:22:06 +00:00
import PageTitle from "~/features/core/components/page-title";
import MissingTwilioCredentials from "~/features/core/components/missing-twilio-credentials";
import ConversationsList from "~/features/messages/components/conversations-list";
2022-05-19 23:16:38 +00:00
import NewMessageButton from "~/features/messages/components/new-message-button";
2022-05-20 00:45:07 +00:00
import NewMessageBottomSheet from "~/features/messages/components/new-message-bottom-sheet";
2022-05-21 23:45:13 +00:00
import { getSeoMeta } from "~/utils/seo";
export const meta: MetaFunction = () => ({
...getSeoMeta({ title: "Messages" }),
});
2022-05-14 10:22:06 +00:00
2022-05-19 23:16:38 +00:00
export const loader = messagesLoader;
2022-05-14 10:22:06 +00:00
export default function MessagesPage() {
2022-05-21 23:45:13 +00:00
const { hasPhoneNumber } = useLoaderData<MessagesLoaderData>();
2022-05-20 00:45:07 +00:00
const setIsNewMessageSheetOpen = useAtom(bottomSheetOpenAtom)[1];
2022-05-14 10:22:06 +00:00
2022-05-21 23:45:13 +00:00
if (!hasPhoneNumber) {
2022-05-14 10:22:06 +00:00
return (
<>
<MissingTwilioCredentials />
<PageTitle className="filter blur-sm select-none absolute top-0" title="Messages" />
</>
);
}
return (
<>
<PageTitle title="Messages" />
<section className="flex flex-grow flex-col">
<ConversationsList />
</section>
2022-05-20 00:45:07 +00:00
<NewMessageButton onClick={() => setIsNewMessageSheetOpen(true)} />
<NewMessageBottomSheet />
2022-05-14 10:22:06 +00:00
</>
);
}
2022-05-20 00:45:07 +00:00
export const bottomSheetOpenAtom = atom(false);