jared
baa12823f7
- matrix.ts: rateLimitedActions fallback delay now uses capped exponential backoff (min(1000 * 2^n, 30s)) instead of flat 3000ms when server omits Retry-After; server header still takes precedence - RenderMessageContent: add objectFit:cover + 100% fill to video thumbnail <Image> so thumbnails fill their container without letterboxing (P5-6) - CreateRoomModal, CreateSpaceModal: apply useModalStyle(480) for fullscreen on mobile - LOTUS_BUGS: mark usePan memory leak + httpStatus check as FALSE POSITIVE; mark rateLimitedActions backoff as FIXED Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
100 lines
3.0 KiB
TypeScript
100 lines
3.0 KiB
TypeScript
import React from 'react';
|
|
import {
|
|
Box,
|
|
config,
|
|
Header,
|
|
Icon,
|
|
IconButton,
|
|
Icons,
|
|
Modal,
|
|
Overlay,
|
|
OverlayBackdrop,
|
|
OverlayCenter,
|
|
Scroll,
|
|
Text,
|
|
} from 'folds';
|
|
import FocusTrap from 'focus-trap-react';
|
|
import { useAllJoinedRoomsSet, useGetRoom } from '../../hooks/useGetRoom';
|
|
import { SpaceProvider } from '../../hooks/useSpace';
|
|
import { CreateSpaceForm } from './CreateSpace';
|
|
import {
|
|
useCloseCreateSpaceModal,
|
|
useCreateSpaceModalState,
|
|
} from '../../state/hooks/createSpaceModal';
|
|
import { CreateSpaceModalState } from '../../state/createSpaceModal';
|
|
import { stopPropagation } from '../../utils/keyboard';
|
|
import { useModalStyle } from '../../hooks/useModalStyle';
|
|
|
|
type CreateSpaceModalProps = {
|
|
state: CreateSpaceModalState;
|
|
};
|
|
function CreateSpaceModal({ state }: CreateSpaceModalProps) {
|
|
const { spaceId } = state;
|
|
const closeDialog = useCloseCreateSpaceModal();
|
|
const modalStyle = useModalStyle(480);
|
|
|
|
const allJoinedRooms = useAllJoinedRoomsSet();
|
|
const getRoom = useGetRoom(allJoinedRooms);
|
|
const space = spaceId ? getRoom(spaceId) : undefined;
|
|
|
|
return (
|
|
<SpaceProvider value={space ?? null}>
|
|
<Overlay open backdrop={<OverlayBackdrop />}>
|
|
<OverlayCenter>
|
|
<FocusTrap
|
|
focusTrapOptions={{
|
|
initialFocus: false,
|
|
clickOutsideDeactivates: true,
|
|
onDeactivate: closeDialog,
|
|
escapeDeactivates: stopPropagation,
|
|
}}
|
|
>
|
|
<Modal size="300" flexHeight style={modalStyle}>
|
|
<Box direction="Column">
|
|
<Header
|
|
size="500"
|
|
style={{
|
|
padding: config.space.S200,
|
|
paddingLeft: config.space.S400,
|
|
borderBottomWidth: config.borderWidth.B300,
|
|
}}
|
|
>
|
|
<Box grow="Yes">
|
|
<Text as="h2" size="H4">
|
|
New Space
|
|
</Text>
|
|
</Box>
|
|
<Box shrink="No">
|
|
<IconButton size="300" radii="300" onClick={closeDialog} aria-label="Close">
|
|
<Icon src={Icons.Cross} />
|
|
</IconButton>
|
|
</Box>
|
|
</Header>
|
|
<Scroll size="300" hideTrack>
|
|
<Box
|
|
style={{
|
|
padding: config.space.S400,
|
|
paddingRight: config.space.S200,
|
|
}}
|
|
direction="Column"
|
|
gap="500"
|
|
>
|
|
<CreateSpaceForm space={space} onCreate={closeDialog} />
|
|
</Box>
|
|
</Scroll>
|
|
</Box>
|
|
</Modal>
|
|
</FocusTrap>
|
|
</OverlayCenter>
|
|
</Overlay>
|
|
</SpaceProvider>
|
|
);
|
|
}
|
|
|
|
export function CreateSpaceModalRenderer() {
|
|
const state = useCreateSpaceModalState();
|
|
|
|
if (!state) return null;
|
|
return <CreateSpaceModal state={state} />;
|
|
}
|