From 9e552da8d85b6e3bef168e36954695af5db1199d Mon Sep 17 00:00:00 2001
From: Peter Zimon <peter.zimon@gmail.com>
Date: Tue, 8 Oct 2024 16:13:16 +0100
Subject: [PATCH] Removed change theme from brand for real

---
 .../src/global/modal/PreviewModal.tsx         |  8 ++---
 .../components/settings/site/DesignModal.tsx  | 31 ++-----------------
 2 files changed, 7 insertions(+), 32 deletions(-)

diff --git a/apps/admin-x-design-system/src/global/modal/PreviewModal.tsx b/apps/admin-x-design-system/src/global/modal/PreviewModal.tsx
index 7b70798cb6..6c7c7e440f 100644
--- a/apps/admin-x-design-system/src/global/modal/PreviewModal.tsx
+++ b/apps/admin-x-design-system/src/global/modal/PreviewModal.tsx
@@ -220,11 +220,11 @@ export const PreviewModalContent: React.FC<PreviewModalProps> = ({
 
         preview = (
             <div className={containerClasses}>
-                {previewToolbar && <header className="relative flex h-[74px] shrink-0 items-center justify-center px-3 py-5" data-testid="design-toolbar">
-                    {leftToolbar && <div className='absolute left-5 flex h-full items-center'>
+                {previewToolbar && <header className="relative flex h-[80px] shrink-0 items-center justify-center px-8 py-5" data-testid="design-toolbar">
+                    {leftToolbar && <div className='absolute left-8 flex h-full items-center'>
                         {toolbarLeft}
                     </div>}
-                    {rightToolbar && <div className='absolute right-5 flex h-full items-center'>
+                    {rightToolbar && <div className='absolute right-8 flex h-full items-center'>
                         {toolbarRight}
                         {viewSiteButton}
                     </div>}
@@ -287,7 +287,7 @@ export const PreviewModalContent: React.FC<PreviewModalProps> = ({
                                 {sidebarButtons ? sidebarButtons : <ButtonGroup buttons={buttons} /> }
                             </div>
                         )}
-                        <div className={`${!sidebarHeader ? 'absolute inset-x-0 bottom-0 top-[74px] grow' : ''} ${sidebarPadding && 'p-7 pt-0'} flex flex-col justify-between overflow-y-auto ${sidebarContentClasses && sidebarContentClasses}`}>
+                        <div className={`${!sidebarHeader ? 'absolute inset-x-0 bottom-0 top-[80px] grow' : ''} ${sidebarPadding && 'p-7 pt-0'} flex flex-col justify-between overflow-y-auto ${sidebarContentClasses && sidebarContentClasses}`}>
                             {sidebar}
                         </div>
                     </div>
diff --git a/apps/admin-x-settings/src/components/settings/site/DesignModal.tsx b/apps/admin-x-settings/src/components/settings/site/DesignModal.tsx
index 4848c04109..0525d197d8 100644
--- a/apps/admin-x-settings/src/components/settings/site/DesignModal.tsx
+++ b/apps/admin-x-settings/src/components/settings/site/DesignModal.tsx
@@ -4,11 +4,10 @@ import ThemePreview from './designAndBranding/ThemePreview';
 import ThemeSettings from './designAndBranding/ThemeSettings';
 import useQueryParams from '../../../hooks/useQueryParams';
 import {CustomThemeSetting, useBrowseCustomThemeSettings, useEditCustomThemeSettings} from '@tryghost/admin-x-framework/api/customThemeSettings';
-import {Icon, PreviewModalContent, StickyFooter, Tab, TabView} from '@tryghost/admin-x-design-system';
+import {PreviewModalContent, Tab, TabView} from '@tryghost/admin-x-design-system';
 import {Setting, SettingValue, getSettingValues, useEditSettings} from '@tryghost/admin-x-framework/api/settings';
 import {getHomepageUrl} from '@tryghost/admin-x-framework/api/site';
 import {useBrowsePosts} from '@tryghost/admin-x-framework/api/posts';
-import {useBrowseThemes} from '@tryghost/admin-x-framework/api/themes';
 import {useForm, useHandleError} from '@tryghost/admin-x-framework/hooks';
 import {useGlobalData} from '../../providers/GlobalDataProvider';
 import {useRouting} from '@tryghost/admin-x-framework/routing';
@@ -25,15 +24,9 @@ const Sidebar: React.FC<{
     themeSettingSections,
     updateBrandSetting,
     updateThemeSetting,
-    onTabChange,
-    handleSave
+    onTabChange
 }) => {
-    const {updateRoute} = useRouting();
     const [selectedTab, setSelectedTab] = useState('brand');
-    const {data: {themes} = {}} = useBrowseThemes();
-    const refParam = useQueryParams().getParam('ref');
-
-    const activeTheme = themes?.find(theme => theme.active);
 
     const tabs: Tab[] = [
         {
@@ -55,27 +48,9 @@ const Sidebar: React.FC<{
 
     return (
         <div className='flex h-full flex-col justify-between'>
-            <div className='p-7' data-testid="design-setting-tabs">
+            <div className='p-7 pt-2' data-testid="design-setting-tabs">
                 <TabView selectedTab={selectedTab} tabs={tabs} onTabChange={handleTabChange} />
             </div>
-            <StickyFooter height={74}>
-                <div className='w-full px-7'>
-                    <button className='group flex w-full items-center justify-between text-sm font-medium opacity-80 transition-all hover:opacity-100' data-testid='change-theme' type='button' onClick={async () => {
-                        await handleSave();
-                        if (refParam) {
-                            updateRoute(`design/change-theme?ref=${refParam}`);
-                        } else {
-                            updateRoute('design/change-theme');
-                        }
-                    }}>
-                        <div className='text-left'>
-                            <div className='font-semibold'>Change theme</div>
-                            <div className='font-sm text-grey-700'>Current theme: {activeTheme?.name} - v{activeTheme?.package.version}</div>
-                        </div>
-                        <Icon className='mr-2 transition-all group-hover:translate-x-2 dark:text-white' name='chevron-right' size='sm' />
-                    </button>
-                </div>
-            </StickyFooter>
         </div>
     );
 };