feat(frontend): add create channel action in channel pane
This commit is contained in:
@@ -19,6 +19,7 @@ export default function ChatPage() {
|
|||||||
const [channels, setChannels] = useState<GuildChannel[]>([])
|
const [channels, setChannels] = useState<GuildChannel[]>([])
|
||||||
const [messages, setMessages] = useState<MessageItem[]>([])
|
const [messages, setMessages] = useState<MessageItem[]>([])
|
||||||
const [content, setContent] = useState('')
|
const [content, setContent] = useState('')
|
||||||
|
const [newChannelName, setNewChannelName] = useState('')
|
||||||
const [loading, setLoading] = useState(false)
|
const [loading, setLoading] = useState(false)
|
||||||
const [error, setError] = useState('')
|
const [error, setError] = useState('')
|
||||||
|
|
||||||
@@ -97,6 +98,20 @@ export default function ChatPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function createChannel() {
|
||||||
|
if (!guild || !guildToken || !newChannelName.trim()) return
|
||||||
|
setError('')
|
||||||
|
try {
|
||||||
|
const res = await guildApi().post('/channels', { name: newChannelName.trim() })
|
||||||
|
const createdId = res.data?.id as string | undefined
|
||||||
|
setNewChannelName('')
|
||||||
|
await loadChannels()
|
||||||
|
if (createdId) setSelectedChannelId(createdId)
|
||||||
|
} catch {
|
||||||
|
setError('Failed to create channel')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
void loadChannels()
|
void loadChannels()
|
||||||
setMessages([])
|
setMessages([])
|
||||||
@@ -146,6 +161,15 @@ export default function ChatPage() {
|
|||||||
|
|
||||||
<div className="panel col-list">
|
<div className="panel col-list">
|
||||||
<h3>Channels</h3>
|
<h3>Channels</h3>
|
||||||
|
<div className="row-wrap" style={{ marginBottom: 8 }}>
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
value={newChannelName}
|
||||||
|
onChange={(e) => setNewChannelName(e.target.value)}
|
||||||
|
placeholder="New channel name"
|
||||||
|
/>
|
||||||
|
<button className="btn btn-secondary" onClick={createChannel}>Create channel</button>
|
||||||
|
</div>
|
||||||
<ul className="list-reset">
|
<ul className="list-reset">
|
||||||
{channels.map((c) => (
|
{channels.map((c) => (
|
||||||
<li key={c.id}>
|
<li key={c.id}>
|
||||||
|
|||||||
Reference in New Issue
Block a user