ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web App Popup: Fix layout (#6581)

Browse Source
This commit is contained in:
Alexander Zinchuk 2026-01-13 01:14:30 +01:00
parent d6f2f1cb4a
commit bb56647584
2 changed files with 30 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/modals/webApp/WebAppModalTabContent.module.scss
View File

@ -242,11 +242,13 @@
.web-app-popup { .web-app-popup {
:global(.modal-dialog) { :global(.modal-dialog) {
width: auto;
min-width: min(22rem, 100%) !important;
max-width: min(30rem, 100%); max-width: min(30rem, 100%);
} }
&.without-title :global(.modal-content) { &.without-title :global(.modal-content) {
padding-top: 0; padding-top: 0.75rem;
} }
:global(.modal-content) { :global(.modal-content) {

15
src/components/modals/webApp/WebAppModalTabContent.tsx
View File

@ -150,6 +150,9 @@ const WebAppModalTabContent: FC<OwnProps & StateProps> = ({
const [isLoaded, markLoaded, markUnloaded] = useFlag(false); const [isLoaded, markLoaded, markUnloaded] = useFlag(false);
const [popupParameters, setPopupParameters] = useState<PopupOptions>(); const [popupParameters, setPopupParameters] = useState<PopupOptions>();
const renderingPopupParameters = useCurrentOrPrev(popupParameters);
const [isRequestingPhone, setIsRequestingPhone] = useState(false); const [isRequestingPhone, setIsRequestingPhone] = useState(false);
const [isRequestingWriteAccess, setIsRequestingWriteAccess] = useState(false); const [isRequestingWriteAccess, setIsRequestingWriteAccess] = useState(false);
const [clipboardRequestId, setClipboardRequestId] = useState<string>(); const [clipboardRequestId, setClipboardRequestId] = useState<string>();
@ -1153,19 +1156,18 @@ const WebAppModalTabContent: FC<OwnProps & StateProps> = ({
</Button> </Button>
</div> </div>
)} )}
{popupParameters && (
<Modal <Modal
isOpen={Boolean(popupParameters)} isOpen={Boolean(popupParameters)}
title={popupParameters.title || NBSP} title={renderingPopupParameters?.title || NBSP}
className={ className={
buildClassName(styles.webAppPopup, !popupParameters.title?.trim().length && styles.withoutTitle) buildClassName(styles.webAppPopup, !renderingPopupParameters?.title?.trim().length && styles.withoutTitle)
} }
hasAbsoluteCloseButton hasCloseButton
onClose={handleAppPopupModalClose} onClose={handleAppPopupModalClose}
> >
{popupParameters.message} {renderingPopupParameters?.message}
<div className="dialog-buttons mt-2"> <div className="dialog-buttons mt-2">
{popupParameters.buttons.map((button) => ( {renderingPopupParameters?.buttons.map((button) => (
<Button <Button
key={button.id || button.type} key={button.id || button.type}
className="confirm-dialog-button" className="confirm-dialog-button"
@ -1178,7 +1180,6 @@ const WebAppModalTabContent: FC<OwnProps & StateProps> = ({
))} ))}
</div> </div>
</Modal> </Modal>
)}
<ConfirmDialog <ConfirmDialog
isOpen={isRequestingPhone} isOpen={isRequestingPhone}