From 47d3b266c0447fabd8177cb7770d79f39292891b Mon Sep 17 00:00:00 2001
From: siandreev <andreev.sergey.i@yandex.ru>
Date: Fri, 13 Dec 2024 15:11:12 +0100
Subject: [PATCH] fix: widget modals bottom padding

---
 apps/web-swap-widget/package.json                    |  2 +-
 .../src/components/SwapWidgetTxSent.tsx              |  1 -
 packages/uikit/src/components/Notification.tsx       | 12 +++++++++++-
 .../swap/tokens-list/SwapTokensListNotification.tsx  |  2 +-
 packages/uikit/src/hooks/appContext.ts               |  2 +-
 5 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/apps/web-swap-widget/package.json b/apps/web-swap-widget/package.json
index 0e537e436..4e2119c4a 100644
--- a/apps/web-swap-widget/package.json
+++ b/apps/web-swap-widget/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@tonkeeper/web-swap-widget",
-    "version": "3.0.1",
+    "version": "3.0.2",
     "author": "Ton APPS UK Limited <support@tonkeeper.com>",
     "description": "Web swap widget for Tonkeeper",
     "dependencies": {
diff --git a/apps/web-swap-widget/src/components/SwapWidgetTxSent.tsx b/apps/web-swap-widget/src/components/SwapWidgetTxSent.tsx
index 4351fa47e..c788c5a11 100644
--- a/apps/web-swap-widget/src/components/SwapWidgetTxSent.tsx
+++ b/apps/web-swap-widget/src/components/SwapWidgetTxSent.tsx
@@ -26,7 +26,6 @@ const Wrapper = styled.div`
     flex-direction: column;
     align-items: center;
     text-align: center;
-    padding-bottom: 46px;
 `;
 
 const CheckmarkCircleIcon = () => {
diff --git a/packages/uikit/src/components/Notification.tsx b/packages/uikit/src/components/Notification.tsx
index b4b17b9d3..59f1e04ca 100644
--- a/packages/uikit/src/components/Notification.tsx
+++ b/packages/uikit/src/components/Notification.tsx
@@ -27,6 +27,7 @@ import ReactPortal from './ReactPortal';
 import { H2, H3, Label2 } from './Text';
 import { IconButtonTransparentBackground } from './fields/IconButton';
 import { AnimateHeightChange } from './shared/AnimateHeightChange';
+import { useAppPlatform } from '../hooks/appContext';
 
 const NotificationContainer = styled(Container)<{ scrollbarWidth: number }>`
     background: transparent;
@@ -170,7 +171,7 @@ const Splash = styled.div`
     }
 `;
 
-const Content = styled.div<{ standalone: boolean }>`
+const Content = styled.div<{ standalone: boolean; $isInWidget: boolean }>`
     width: 100%;
     background-color: ${props => props.theme.backgroundPage};
     border-top-right-radius: ${props => props.theme.cornerMedium};
@@ -185,6 +186,12 @@ const Content = styled.div<{ standalone: boolean }>`
             padding-bottom: 2rem;
         `}
 
+    ${props =>
+        props.$isInWidget &&
+        css`
+            padding-bottom: 46px;
+        `}
+
     ${p =>
         p.theme.displayType === 'full-width' &&
         css`
@@ -585,6 +592,8 @@ export const Notification: FC<{
     const containerRef = useClickOutside<HTMLDivElement>(onClickOutside, nodeRef.current);
     const [onBack, setOnBack] = useState<(() => void) | undefined>();
 
+    const isInWidget = useAppPlatform() === 'swap-widget-web';
+
     return (
         <NotificationContext.Provider
             value={{ footerElement, headerElement, setOnBack, setOnCloseInterceptor }}
@@ -607,6 +616,7 @@ export const Notification: FC<{
                                     <Padding onClick={handleCloseOnlyOnNotFullWidth} />
                                     <GapAdjusted onClick={handleCloseOnlyOnNotFullWidth} />
                                     <Content
+                                        $isInWidget={isInWidget}
                                         standalone={standalone}
                                         ref={containerRef}
                                         className="dialog-content"
diff --git a/packages/uikit/src/components/swap/tokens-list/SwapTokensListNotification.tsx b/packages/uikit/src/components/swap/tokens-list/SwapTokensListNotification.tsx
index ea9f12fc7..7fc66e70c 100644
--- a/packages/uikit/src/components/swap/tokens-list/SwapTokensListNotification.tsx
+++ b/packages/uikit/src/components/swap/tokens-list/SwapTokensListNotification.tsx
@@ -65,7 +65,7 @@ const SwapTokensListContentWrapper = styled.div`
                   height: 580px;
               `
             : css`
-                  height: calc(var(--app-height) - 6rem);
+                  height: calc(var(--app-height) - 8rem);
               `}
 `;
 
diff --git a/packages/uikit/src/hooks/appContext.ts b/packages/uikit/src/hooks/appContext.ts
index 69dab1c08..361727d21 100644
--- a/packages/uikit/src/hooks/appContext.ts
+++ b/packages/uikit/src/hooks/appContext.ts
@@ -67,5 +67,5 @@ export const AppSelectionContext = React.createContext<EventTarget | null>(null)
 
 export const useAppPlatform = () => {
     const { tonendpoint } = useAppContext();
-    return tonendpoint.params.platform;
+    return tonendpoint.targetEnv;
 };