feat: room form edit with enter (#662)

* room form edit with enter

* mobile form enter do nothing

* restore overwritten older change

---------

Co-authored-by: Igor Loskutov <igor.loskutoff@gmail.com>
This commit is contained in:
Igor Monadical
2025-09-19 15:14:40 -04:00
committed by GitHub
parent 0abcebfc94
commit 47716f6e5d

View File

@@ -309,7 +309,7 @@ export default function RoomsList() {
setRoomInput(null);
setIsEditing(false);
setEditRoomId("");
setEditRoomId(null);
setNameError("");
refetch();
onClose();
@@ -449,6 +449,13 @@ export default function RoomsList() {
</Dialog.CloseTrigger>
</Dialog.Header>
<Dialog.Body>
<form
id="room-form"
onSubmit={(e) => {
e.preventDefault();
handleSaveRoom();
}}
>
<Tabs.Root defaultValue="general">
<Tabs.List>
<Tabs.Trigger value="general">General</Tabs.Trigger>
@@ -465,6 +472,7 @@ export default function RoomsList() {
placeholder="room-name"
value={room.name}
onChange={handleRoomChange}
enterKeyHint="next"
/>
<Field.HelperText>
No spaces or special characters allowed
@@ -496,7 +504,6 @@ export default function RoomsList() {
<Checkbox.Label>Locked room</Checkbox.Label>
</Checkbox.Root>
</Field.Root>
<Field.Root mt={4}>
<Field.Label>Room size</Field.Label>
<Select.Root
@@ -527,7 +534,6 @@ export default function RoomsList() {
</Select.Positioner>
</Select.Root>
</Field.Root>
<Field.Root mt={4}>
<Field.Label>Recording type</Field.Label>
<Select.Root
@@ -565,13 +571,15 @@ export default function RoomsList() {
</Select.Positioner>
</Select.Root>
</Field.Root>
<Field.Root mt={4}>
<Field.Label>Cloud recording start trigger</Field.Label>
<Select.Root
value={[room.recordingTrigger]}
onValueChange={(e) =>
setRoomInput({ ...room, recordingTrigger: e.value[0] })
setRoomInput({
...room,
recordingTrigger: e.value[0],
})
}
collection={recordingTriggerCollection}
disabled={room.recordingType !== "cloud"}
@@ -622,34 +630,6 @@ export default function RoomsList() {
</Field.Root>
</Tabs.Content>
<Tabs.Content value="calendar" pt={6}>
<ICSSettings
roomName={room.name ? parseNonEmptyString(room.name) : null}
icsUrl={room.icsUrl}
icsEnabled={room.icsEnabled}
icsFetchInterval={room.icsFetchInterval}
onChange={(settings) => {
setRoomInput({
...room,
icsUrl:
settings.ics_url !== undefined
? settings.ics_url
: room.icsUrl,
icsEnabled:
settings.ics_enabled !== undefined
? settings.ics_enabled
: room.icsEnabled,
icsFetchInterval:
settings.ics_fetch_interval !== undefined
? settings.ics_fetch_interval
: room.icsFetchInterval,
});
}}
isOwner={true}
isEditing={isEditing}
/>
</Tabs.Content>
<Tabs.Content value="share" pt={6}>
<Field.Root>
<Checkbox.Root
@@ -675,7 +655,6 @@ export default function RoomsList() {
</Checkbox.Label>
</Checkbox.Root>
</Field.Root>
<Field.Root mt={4}>
<Field.Label>Zulip stream</Field.Label>
<Select.Root
@@ -711,7 +690,6 @@ export default function RoomsList() {
</Select.Positioner>
</Select.Root>
</Field.Root>
<Field.Root mt={4}>
<Field.Label>Zulip topic</Field.Label>
<Select.Root
@@ -750,10 +728,10 @@ export default function RoomsList() {
<Field.Label>Webhook URL</Field.Label>
<Input
name="webhookUrl"
type="url"
placeholder="https://example.com/webhook"
value={room.webhookUrl}
onChange={handleRoomChange}
enterKeyHint="next"
/>
<Field.HelperText>
Optional: URL to receive notifications when transcripts
@@ -832,7 +810,8 @@ export default function RoomsList() {
maxWidth: "100%",
padding: "8px",
borderRadius: "4px",
backgroundColor: webhookTestResult.startsWith(
backgroundColor:
webhookTestResult.startsWith(
SUCCESS_EMOJI,
)
? "#f0fdf4"
@@ -849,15 +828,49 @@ export default function RoomsList() {
</>
)}
</Tabs.Content>
<Tabs.Content value="calendar" pt={6}>
<Field.Root>
<ICSSettings
roomName={
room.name ? parseNonEmptyString(room.name) : null
}
icsUrl={room.icsUrl}
icsEnabled={room.icsEnabled}
icsFetchInterval={room.icsFetchInterval}
onChange={(settings) => {
setRoomInput({
...room,
icsUrl:
settings.ics_url !== undefined
? settings.ics_url
: room.icsUrl,
icsEnabled:
settings.ics_enabled !== undefined
? settings.ics_enabled
: room.icsEnabled,
icsFetchInterval:
settings.ics_fetch_interval !== undefined
? settings.ics_fetch_interval
: room.icsFetchInterval,
});
}}
isOwner={true}
isEditing={isEditing}
/>
</Field.Root>
</Tabs.Content>
</Tabs.Root>
</form>
</Dialog.Body>
<Dialog.Footer>
<Button variant="ghost" onClick={handleCloseDialog}>
Cancel
</Button>
<Button
type="submit"
colorPalette="primary"
onClick={handleSaveRoom}
form="room-form"
disabled={
!room.name || (room.zulipAutoPost && !room.zulipTopic)
}