Add portals for selects in dialogs (#5253)

This commit is contained in:
WithoutPants 2024-09-11 16:12:18 +10:00 committed by GitHub
parent 17be7e97d3
commit 5c4bf4ecdf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 24 additions and 0 deletions

View file

@ -63,6 +63,7 @@ export const OptionsEditor: React.FC<IOptionsEditor> = ({
options.skipMultipleMatchTag ? [options.skipMultipleMatchTag] : []
}
noSelectionString="Select/create tag..."
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>
@ -98,6 +99,7 @@ export const OptionsEditor: React.FC<IOptionsEditor> = ({
: []
}
noSelectionString="Select/create tag..."
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>

View file

@ -211,6 +211,7 @@ export const EditGalleriesDialog: React.FC<IListOperationProps> = (
existingIds={existingIds ?? []}
ids={ids ?? []}
mode={mode}
menuPortalTarget={document.body}
/>
);
}
@ -273,6 +274,7 @@ export const EditGalleriesDialog: React.FC<IListOperationProps> = (
}
ids={studioId ? [studioId] : []}
isDisabled={isUpdating}
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>

View file

@ -14,6 +14,7 @@ export const ContainingGroupsMultiSet: React.FC<{
disabled?: boolean;
onUpdate: (value: IRelatedGroupEntry[]) => void;
onSetMode: (mode: GQL.BulkUpdateIdMode) => void;
menuPortalTarget?: HTMLElement | null;
}> = (props) => {
const { mode, onUpdate, existingValue } = props;
@ -48,12 +49,14 @@ export const ContainingGroupsMultiSet: React.FC<{
value={props.value}
onUpdate={props.onUpdate}
disabled={props.disabled}
menuPortalTarget={props.menuPortalTarget}
/>
) : (
<GroupSelect
onSelect={(items) => onRemoveSet(items)}
values={[]}
isDisabled={props.disabled}
menuPortalTarget={props.menuPortalTarget}
/>
)}
</div>

View file

@ -227,6 +227,7 @@ export const EditGroupsDialog: React.FC<IListOperationProps> = (
}
ids={studioId ? [studioId] : []}
isDisabled={isUpdating}
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>
@ -241,6 +242,7 @@ export const EditGroupsDialog: React.FC<IListOperationProps> = (
existingValue={existingContainingGroups ?? []}
value={containingGroups ?? []}
mode={containingGroupsMode}
menuPortalTarget={document.body}
/>
</Form.Group>
<Form.Group controlId="director">
@ -267,6 +269,7 @@ export const EditGroupsDialog: React.FC<IListOperationProps> = (
existingIds={existingTagIds ?? []}
ids={tagIds ?? []}
mode={tagMode}
menuPortalTarget={document.body}
/>
</Form.Group>
</Form>

View file

@ -19,6 +19,7 @@ export const RelatedGroupTable: React.FC<{
excludeIDs?: string[];
filterHook?: (f: ListFilterModel) => ListFilterModel;
disabled?: boolean;
menuPortalTarget?: HTMLElement | null;
}> = (props) => {
const { value, onUpdate } = props;
@ -101,6 +102,7 @@ export const RelatedGroupTable: React.FC<{
excludeIds={excludeIDs}
filterHook={props.filterHook}
isDisabled={props.disabled}
menuPortalTarget={props.menuPortalTarget}
/>
</Col>
<Col xs={3}>
@ -129,6 +131,7 @@ export const RelatedGroupTable: React.FC<{
excludeIds={excludeIDs}
filterHook={props.filterHook}
isDisabled={props.disabled}
menuPortalTarget={props.menuPortalTarget}
/>
</Col>
</Row>

View file

@ -237,6 +237,7 @@ export const EditImagesDialog: React.FC<IListOperationProps> = (
}
ids={studioId ? [studioId] : []}
isDisabled={isUpdating}
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>
@ -253,6 +254,7 @@ export const EditImagesDialog: React.FC<IListOperationProps> = (
existingIds={existingPerformerIds ?? []}
ids={performerIds ?? []}
mode={performerMode}
menuPortalTarget={document.body}
/>
</Form.Group>
@ -268,6 +270,7 @@ export const EditImagesDialog: React.FC<IListOperationProps> = (
existingIds={existingTagIds ?? []}
ids={tagIds ?? []}
mode={tagMode}
menuPortalTarget={document.body}
/>
</Form.Group>
@ -283,6 +286,7 @@ export const EditImagesDialog: React.FC<IListOperationProps> = (
existingIds={existingGalleryIds ?? []}
ids={galleryIds ?? []}
mode={galleryMode}
menuPortalTarget={document.body}
/>
</Form.Group>

View file

@ -369,6 +369,7 @@ export const EditPerformersDialog: React.FC<IListOperationProps> = (
existingIds={existingTagIds ?? []}
ids={tagIds.ids ?? []}
mode={tagIds.mode}
menuPortalTarget={document.body}
/>
</Form.Group>

View file

@ -226,6 +226,7 @@ export const EditScenesDialog: React.FC<IListOperationProps> = (
ids={ids ?? []}
existingIds={existingIds ?? []}
mode={mode}
menuPortalTarget={document.body}
/>
);
}
@ -288,6 +289,7 @@ export const EditScenesDialog: React.FC<IListOperationProps> = (
}
ids={studioId ? [studioId] : []}
isDisabled={isUpdating}
menuPortalTarget={document.body}
/>
</Col>
</Form.Group>

View file

@ -17,6 +17,7 @@ interface IMultiSetProps {
disabled?: boolean;
onUpdate: (ids: string[]) => void;
onSetMode: (mode: GQL.BulkUpdateIdMode) => void;
menuPortalTarget?: HTMLElement | null;
}
const Select: React.FC<IMultiSetProps> = (props) => {
@ -36,6 +37,7 @@ const Select: React.FC<IMultiSetProps> = (props) => {
ids={props.ids ?? []}
// exclude file-based galleries when setting galleries
extraCriteria={excludeFileBasedGalleries}
menuPortalTarget={props.menuPortalTarget}
/>
);
}
@ -48,6 +50,7 @@ const Select: React.FC<IMultiSetProps> = (props) => {
isClearable={false}
onSelect={onUpdate}
ids={props.ids ?? []}
menuPortalTarget={props.menuPortalTarget}
/>
);
};

View file

@ -48,6 +48,7 @@ function Tags(props: {
existingIds={existingTagIds ?? []}
ids={tagIDs.ids ?? []}
mode={tagIDs.mode}
menuPortalTarget={document.body}
/>
</Form.Group>
);