Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-03 23:00:14 -05:00
Code Issues Activity

Replaced tab component in themes (AdminX)

Browse source 
refs. https://github.com/TryGhost/Team/issues/3432
This commit is contained in:
Peter Zimon 2023-06-13 12:48:33 +02:00
parent 1071d4437c
commit 6023bddafc
2 changed files with 16 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
ghost/admin-x-settings/src/components/settings/site/DesignModal.tsx
View file

@ -128,11 +128,6 @@ const DesignModal: React.FC = () => {
title: id === 'site-wide' ? 'Site wide' : (id === 'homepage' ? 'Homepage' : 'Post')
}));
// const urlOptions: SelectOption[] = [
// {value: getHomepageUrl(siteData!), label: 'Homepage'},
// latestPost && {value: latestPost.url, label: 'Post'}
// ].filter((option): option is SelectOption => Boolean(option));
let previewTabs: Tab[] = [];
if (latestPost) {
previewTabs = [

39
ghost/admin-x-settings/src/components/settings/site/ThemeModal.tsx
View file

@ -6,10 +6,11 @@ import Modal from '../../../admin-x-ds/global/Modal';
import NewThemePreview from './theme/ThemePreview';
import NiceModal, {useModal} from '@ebay/nice-modal-react';
import OfficialThemes from './theme/OfficialThemes';
import TabView from '../../../admin-x-ds/global/TabView';
import {useState} from 'react';
const ChangeThemeModal = NiceModal.create(() => {
const [currentTab, setCurrentTab] = useState<'official-themes' | 'advanced'>('official-themes');
const [currentTab, setCurrentTab] = useState('official');
const [selectedTheme, setSelectedTheme] = useState('');
const modal = useModal();
@ -20,14 +21,14 @@ const ChangeThemeModal = NiceModal.create(() => {
let content;
switch (currentTab) {
case 'official-themes':
case 'official':
if (selectedTheme) {
content = <NewThemePreview selectedTheme={selectedTheme} />;
} else {
content = <OfficialThemes onSelectTheme={onSelectTheme} />;
}
break;
case 'advanced':
case 'installed':
content = <AdvancedThemeSettings />;
break;
}
@ -41,7 +42,7 @@ const ChangeThemeModal = NiceModal.create(() => {
className={`text-sm`}
type="button"
onClick={() => {
setCurrentTab('official-themes');
setCurrentTab('official');
setSelectedTheme('');
}}>
Official themes
@ -62,25 +63,17 @@ const ChangeThemeModal = NiceModal.create(() => {
} else {
toolBar =
<div className='sticky top-0 flex justify-between gap-3 bg-white p-5 px-7'>
<div className='flex gap-8'>
<button
className={`text-sm ${currentTab === 'official-themes' && 'font-bold'}`}
type="button"
onClick={() => {
setCurrentTab('official-themes');
setSelectedTheme('');
}}>
Official themes
</button>
<button
className={`text-sm ${currentTab === 'advanced' && 'font-bold'}`}
type="button"
onClick={() => {
setCurrentTab('advanced');
}}>
Installed
</button>
</div>
<TabView
border={false}
tabs={[
{id: 'official', title: 'Official themes'},
{id: 'installed', title: 'Installed'}
]}
onTabChange={(id: string) => {
setCurrentTab(id);
}}
/>
<div className='flex items-center gap-3'>
<FileUpload id='theme-uplaod' onUpload={(file: File) => {
alert(file.name);