cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-11-22 07:00:58 -05:00
Code Issues Projects Releases Packages Wiki Activity

feat: clean up invite bot page

Browse source
This commit is contained in:
Paul Makles 2022-01-10 20:16:06 +00:00
parent bf82c24281
commit 0255c3167a
1 changed files with 81 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

122
src/pages/invite/InviteBot.tsx
View file

@ -1,5 +1,7 @@
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { ServerPermission } from "revolt.js";
import { Route } from "revolt.js/dist/api/routes"; import { Route } from "revolt.js/dist/api/routes";
import styled from "styled-components";
import { useEffect, useState } from "preact/hooks"; import { useEffect, useState } from "preact/hooks";
@ -12,6 +14,26 @@ import Overline from "../../components/ui/Overline";
import Preloader from "../../components/ui/Preloader"; import Preloader from "../../components/ui/Preloader";
import Tip from "../../components/ui/Tip"; import Tip from "../../components/ui/Tip";
import Markdown from "../../components/markdown/Markdown";
const BotInfo = styled.div`
gap: 12px;
display: flex;
padding: 12px;
h1,
p {
margin: 0;
}
`;
const Option = styled.div`
gap: 8px;
display: flex;
margin-top: 4px;
margin-bottom: 12px;
`;
export default function InviteBot() { export default function InviteBot() {
const { id } = useParams<{ id: string }>(); const { id } = useParams<{ id: string }>();
const client = useClient(); const client = useClient();
@ -34,49 +56,67 @@ export default function InviteBot() {
{typeof data === "undefined" && <Preloader type="spinner" />} {typeof data === "undefined" && <Preloader type="spinner" />}
{data && ( {data && (
<> <>
<UserIcon size={64} attachment={data.avatar} /> <BotInfo>
<h1>{data.username}</h1> <UserIcon size={64} attachment={data.avatar} />
{data.description && <p>{data.description}</p>} <div className="name">
<h1>{data.username}</h1>
{data.description && (
<Markdown content={data.description} />
)}
</div>
</BotInfo>
<Overline type="subtle">Add to server</Overline> <Overline type="subtle">Add to server</Overline>
<ComboBox <Option>
value={server} <ComboBox
onChange={(e) => setServer(e.currentTarget.value)}> value={server}
<option value="none">Select a server</option> onChange={(e) => setServer(e.currentTarget.value)}>
{[...client.servers.values()].map((server) => ( <option value="none">Select a server</option>
<option value={server._id} key={server._id}> {[...client.servers.values()]
{server.name} .filter(
</option> (x) =>
))} x.permission &
</ComboBox> ServerPermission.ManageServer,
<Button )
contrast .map((server) => (
onClick={() => <option value={server._id} key={server._id}>
server !== "none" && {server.name}
client.bots.invite(data._id, { server }) </option>
}> ))}
add </ComboBox>
</Button> <Button
contrast
onClick={() =>
server !== "none" &&
client.bots.invite(data._id, { server })
}>
Add
</Button>
</Option>
<Overline type="subtle">Add to group</Overline> <Overline type="subtle">Add to group</Overline>
<ComboBox <Option>
value={group} <ComboBox
onChange={(e) => setGroup(e.currentTarget.value)}> value={group}
<option value="none">Select a group</option> onChange={(e) => setGroup(e.currentTarget.value)}>
{[...client.channels.values()] <option value="none">Select a group</option>
.filter((x) => x.channel_type === "Group") {[...client.channels.values()]
.map((channel) => ( .filter((x) => x.channel_type === "Group")
<option value={channel._id} key={channel._id}> .map((channel) => (
{channel.name} <option
</option> value={channel._id}
))} key={channel._id}>
</ComboBox> {channel.name}
<Button </option>
contrast ))}
onClick={() => </ComboBox>
group !== "none" && <Button
client.bots.invite(data._id, { group }) contrast
}> onClick={() =>
add group !== "none" &&
</Button> client.bots.invite(data._id, { group })
}>
Add
</Button>
</Option>
</> </>
)} )}
</div> </div>