fix bot adding

AdaptChat · Jul 13, 2024 · c57b884 · c57b884
1 parent f367b21
commit c57b884
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 32 deletions.
diff --git a/src/components/settings/SetBotPermissionsModal.tsx b/src/components/settings/SetBotPermissionsModal.tsx
@@ -1,14 +1,14 @@
-import {Setter, Signal} from "solid-js";
-import {ModalTemplate} from "../ui/Modal";
+import {Signal} from "solid-js";
+import {ModalTemplate, useModal} from "../ui/Modal";
 import PermissionsView from "./PermissionsView";
 import {Permissions} from "../../api/Bitflags";
 
 type Props = {
-  setShow: Setter<boolean>,
   permissionsSignal: Signal<Permissions>,
 }
 
 export function SetRequestedBotPermissionsModal(props: Props & { name: string, allowed: Permissions }) {
+  const {hideModal} = useModal()
   return (
     <ModalTemplate title="Grant Permissions">
       <p class="text-fg/70 text-center mt-4 text-sm font-light">
@@ -18,13 +18,13 @@ export function SetRequestedBotPermissionsModal(props: Props & { name: string, a
         class="flex flex-wrap justify-end mt-4 gap-x-4"
         onSubmit={(event) => {
           event.preventDefault()
-          props.setShow(false)
+          hideModal()
         }}
       >
         <div class="overflow-y-auto max-h-[50vh] px-2">
           <PermissionsView checkbox enabledPermissions={props.allowed} signal={props.permissionsSignal} />
         </div>
-        <button type="button" class="btn flex-grow border-none" onClick={() => props.setShow(false)}>
+        <button type="button" class="btn flex-grow border-none" onClick={() => hideModal()}>
           Done
         </button>
       </form>
@@ -33,6 +33,7 @@ export function SetRequestedBotPermissionsModal(props: Props & { name: string, a
 }
 
 export default function SetBotPermissionsModal(props: Props) {
+  const {hideModal} = useModal()
   return (
     <ModalTemplate title="Default Permissions">
       <p class="text-fg/70 text-center mt-4 text-sm font-light">
@@ -43,13 +44,13 @@ export default function SetBotPermissionsModal(props: Props) {
         class="flex flex-wrap justify-end mt-4 gap-x-4"
         onSubmit={(event) => {
           event.preventDefault()
-          props.setShow(false)
+          hideModal()
         }}
       >
         <div class="overflow-y-auto max-h-[50vh] px-2">
           <PermissionsView checkbox enabledPermissions={Permissions.all()} signal={props.permissionsSignal} />
         </div>
-        <button type="button" class="btn flex-grow border-none" onClick={() => props.setShow(false)}>
+        <button type="button" class="btn flex-grow border-none" onClick={() => hideModal()}>
           Done
         </button>
       </form>

diff --git a/src/components/ui/Modal.tsx b/src/components/ui/Modal.tsx
@@ -4,7 +4,7 @@ import {
   createEffect,
   createSignal,
   Match,
-  ParentProps, Setter,
+  ParentProps, Setter, Signal,
   Switch,
   useContext
 } from "solid-js";
@@ -26,6 +26,8 @@ import AddFriendModal from "../friends/AddFriendModal";
 import SetPresence from "../users/SetPresenceModal";
 import CreateBotModal from "../settings/CreateBotModal";
 import {Bot} from "../../types/user";
+import SetBotPermissionsModal, {SetRequestedBotPermissionsModal} from "../settings/SetBotPermissionsModal";
+import {Permissions} from "../../api/Bitflags";
 
 export enum ModalId {
   NewGuild,
@@ -40,6 +42,8 @@ export enum ModalId {
   AddFriend,
   UpdatePresence,
   CreateBot,
+  SetBotPermissions,
+  SetRequestedBotPermissions,
 }
 
 type ModalMapping = {
@@ -55,6 +59,12 @@ type ModalMapping = {
   [ModalId.AddFriend]: undefined,
   [ModalId.UpdatePresence]: undefined,
   [ModalId.CreateBot]: Setter<Bot[] | null>,
+  [ModalId.SetBotPermissions]: Signal<Permissions>,
+  [ModalId.SetRequestedBotPermissions]: {
+    permissionsSignal: Signal<Permissions>
+    name: string
+    allowed: Permissions
+  },
 }
 
 type ModalDataPair = {
@@ -179,6 +189,12 @@ export function ModalProvider(props: ParentProps) {
           <Match when={context.id === ModalId.CreateBot}>
             <CreateBotModal setBots={context.data as Setter<Bot[] | null>} />
           </Match>
+          <Match when={context.id === ModalId.SetBotPermissions}>
+            <SetBotPermissionsModal permissionsSignal={context.data as any} />
+          </Match>
+          <Match when={context.id === ModalId.SetRequestedBotPermissions}>
+            <SetRequestedBotPermissionsModal {...context.data as any} />
+          </Match>
         </Switch>
       </ModalContainer>
     </ModalContext.Provider>

diff --git a/src/pages/AddBot.tsx b/src/pages/AddBot.tsx
@@ -11,12 +11,10 @@ import ChevronDown from "../components/icons/svg/ChevronDown";
 import GuildIcon from "../components/guilds/GuildIcon";
 import MagnifyingGlass from "../components/icons/svg/MagnifyingGlass";
 import Fuse from "fuse.js";
-import Modal from "../components/ui/Modal";
-import {SetRequestedBotPermissionsModal} from "../components/settings/SetBotPermissionsModal";
+import {ModalId, useModal} from "../components/ui/Modal";
 import RocketLaunch from "../components/icons/svg/RocketLaunch";
 import UserTag from "../components/icons/svg/UserTag";
 import CakeCandles from "../components/icons/svg/CakeCandles";
-import Code from "../components/icons/svg/Code";
 import Lock from "../components/icons/svg/Lock";
 
 export default function AddBot() {
@@ -129,7 +127,6 @@ export default function AddBot() {
     requested = Permissions.empty()
   }
   const [requestedPermissions, setRequestedPermissions] = createSignal<Permissions>(requested)
-  const [showPermissionsModal, setShowPermissionsModal] = createSignal(false)
 
   createEffect(() => {
     if (bot() && !requestedPermissions())
@@ -149,19 +146,13 @@ export default function AddBot() {
   })
   const [isAdding, setIsAdding] = createSignal(false)
 
+  const {showModal} = useModal()
+
   return (
     <div
       class="w-full h-full flex items-center justify-center pb-0 transition-all"
       classList={{ "md:pb-32": isSelecting() }}
     >
-      <Modal get={showPermissionsModal} set={setShowPermissionsModal}>
-        <SetRequestedBotPermissionsModal
-          setShow={setShowPermissionsModal}
-          permissionsSignal={[requestedPermissions, setRequestedPermissions]}
-          name={bot()?.user.display_name ?? '???'}
-          allowed={permissions()?.get(selectedGuildId() as any) ?? Permissions.empty()}
-        />
-      </Modal>
       <div class="flex flex-col rounded-xl bg-bg-0/70 p-8 items-center min-w-[420px] mobile:min-w-0 mobile:w-[90vw]">
         <Show when={bot()} fallback="Loading...">
           <img src={bot()!.user.avatar ?? defaultAvatar(bot()!.user.id)} alt="" class="rounded-full w-24 h-24" />
@@ -246,7 +237,11 @@ export default function AddBot() {
           <div class="grid mt-2 grid-cols-2 gap-2 mobile:grid-cols-1 w-full">
             <button
               class="btn"
-              onClick={() => setShowPermissionsModal(true)}
+              onClick={() => showModal(ModalId.SetRequestedBotPermissions, {
+                permissionsSignal: [requestedPermissions, setRequestedPermissions],
+                name: bot()?.user.display_name ?? '???',
+                allowed: permissions()?.get(selectedGuildId() as any) ?? Permissions.empty(),
+              })}
             >
               <Icon icon={UserTag} class="w-4 h-4 mr-2 fill-fg" />
               Edit Permissions

diff --git a/src/pages/settings/Bot.tsx b/src/pages/settings/Bot.tsx
@@ -14,9 +14,9 @@ import Key from "../../components/icons/svg/Key";
 import Clipboard from "../../components/icons/svg/Clipboard";
 import {BotFlags, Permissions} from "../../api/Bitflags";
 import UserTag from "../../components/icons/svg/UserTag";
-import Modal from "../../components/ui/Modal";
-import SetBotPermissionsModal from "../../components/settings/SetBotPermissionsModal";
+import {ModalId, useModal} from "../../components/ui/Modal";
 import Plus from "../../components/icons/svg/Plus";
+
 void tooltip
 
 function BriefInfo(props: ParentProps<{ label: string, copyText?: string }>) {
@@ -97,20 +97,13 @@ export default function Bot() {
     { loading: 'Copying...', success: 'Copied!', error: 'Failed to Copy' },
   )
 
-  const [showPermissionsModal, setShowPermissionsModal] = createSignal(false)
-
   const navigate = useNavigate()
   const botInvite = () => `https://app.adapt.chat/bots/${params.botId}`
+  const {showModal} = useModal()
 
   return (
     <div class="p-4">
       <Header>Bots</Header>
-      <Modal get={showPermissionsModal} set={setShowPermissionsModal}>
-        <SetBotPermissionsModal
-          setShow={setShowPermissionsModal}
-          permissionsSignal={[defaultPermissions, setDefaultPermissions]}
-        />
-      </Modal>
       <A href="/settings/bots" class="btn btn-sm mr-2">
         <Icon icon={ChevronLeft} class="w-4 h-4 fill-fg" />
         Back
@@ -177,7 +170,9 @@ export default function Bot() {
         <p class="font-light text-sm my-2 text-fg/60">
           Server owners will be asked to grant your bot these permissions when they add it to their server.
         </p>
-        <button class="btn mobile:w-full" onClick={() => setShowPermissionsModal(true)}>
+        <button class="btn mobile:w-full" onClick={() => {
+          showModal(ModalId.SetBotPermissions, [defaultPermissions, setDefaultPermissions])
+        }}>
           <Icon icon={UserTag} class="w-4 h-4 fill-fg mr-2" />
           Edit Permissions
         </button>