mirror of
https://github.com/fallenbagel/jellyseerr.git
synced 2026-01-02 04:39:14 -05:00
eb5502a16f
* fix(ui): remove opacity classes from transition enter and leave props The flickering was caused by the opacity classes in the `leave` prop to take effect as the transition ends; when the `leaveTo` prop classes are no longer applied, but the `leave` prop classes are still applied. * fix(ui): resolve transition issues for all components 1. Remove opacity classes from `enter` and `leave` props 2. Fix some class name typos 3. Remove transform classes since those are automatically applied as from TailwindCSS v3.0 4. Narrow down `transition` classes to only the properties being transitioned in Transition components
32 lines
736 B
TypeScript
32 lines
736 B
TypeScript
import CreateIssueModal from '@app/components/IssueModal/CreateIssueModal';
|
|
import { Transition } from '@headlessui/react';
|
|
|
|
interface IssueModalProps {
|
|
show?: boolean;
|
|
onCancel: () => void;
|
|
mediaType: 'movie' | 'tv';
|
|
tmdbId: number;
|
|
issueId?: never;
|
|
}
|
|
|
|
const IssueModal = ({ show, mediaType, onCancel, tmdbId }: IssueModalProps) => (
|
|
<Transition
|
|
as="div"
|
|
enter="transition-opacity duration-300"
|
|
enterFrom="opacity-0"
|
|
enterTo="opacity-100"
|
|
leave="transition-opacity duration-300"
|
|
leaveFrom="opacity-100"
|
|
leaveTo="opacity-0"
|
|
show={show}
|
|
>
|
|
<CreateIssueModal
|
|
mediaType={mediaType}
|
|
onCancel={onCancel}
|
|
tmdbId={tmdbId}
|
|
/>
|
|
</Transition>
|
|
);
|
|
|
|
export default IssueModal;
|