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

Updated AdminX search to also hide sidebar items (#18109)

Browse source 
refs https://github.com/TryGhost/Product/issues/3832
This commit is contained in:
Jono M 2023-09-13 13:47:05 +01:00 • committed by GitHub
parent dbc93bf1c7
commit 7462ad2be6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 58 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
apps/admin-x-settings/src/admin-x-ds/settings/SettingNavItem.tsx
View file

@ -1,23 +1,28 @@
import React from 'react';
import clsx from 'clsx';
import {useScrollSectionContext} from '../../hooks/useScrollSection';
import {useSearch} from '../../components/providers/ServiceProvider';
interface Props {
title: React.ReactNode;
navid?: string;
keywords?: string[];
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
}
const SettingNavItem: React.FC<Props> = ({
title,
navid = '',
keywords,
onClick = () => {}
}) => {
const {currentSection} = useScrollSectionContext();
const {checkVisible} = useSearch();
const classNames = clsx(
'block px-0 py-1 text-sm dark:text-white',
(currentSection === navid) && 'font-bold'
(currentSection === navid) && 'font-bold',
!checkVisible(keywords || []) && 'hidden'
);
return (

12
apps/admin-x-settings/src/admin-x-ds/settings/SettingNavSection.tsx
View file

@ -1,12 +1,20 @@
import React from 'react';
import SettingSectionHeader from './SettingSectionHeader';
import {useSearch} from '../../components/providers/ServiceProvider';
interface Props {
title?: string;
keywords?: string[];
children?: React.ReactNode;
}
const SettingNavSection: React.FC<Props> = ({title, children}) => {
const SettingNavSection: React.FC<Props> = ({title, keywords, children}) => {
const {checkVisible} = useSearch();
if (!checkVisible(keywords || [])) {
return null;
}
return (
<>
{title && <SettingSectionHeader title={title} />}
@ -19,4 +27,4 @@ const SettingNavSection: React.FC<Props> = ({title, children}) => {
);
};
export default SettingNavSection;
export default SettingNavSection;

70
apps/admin-x-settings/src/components/Sidebar.tsx
View file

@ -5,8 +5,13 @@ import SettingNavSection from '../admin-x-ds/settings/SettingNavSection';
import TextField from '../admin-x-ds/global/form/TextField';
import useFeatureFlag from '../hooks/useFeatureFlag';
import useRouting from '../hooks/useRouting';
import {searchKeywords as advancedSearchKeywords} from './settings/advanced/AdvancedSettings';
import {searchKeywords as emailSearchKeywords} from './settings/email/EmailSettings';
import {searchKeywords as generalSearchKeywords} from './settings/general/GeneralSettings';
import {getSettingValues} from '../api/settings';
import {isEditorUser} from '../api/users';
import {searchKeywords as membershipSearchKeywords} from './settings/membership/MembershipSettings';
import {searchKeywords as siteSearchKeywords} from './settings/site/SiteSettings';
import {useGlobalData} from './providers/GlobalDataProvider';
import {useSearch} from './providers/ServiceProvider';
@ -45,51 +50,50 @@ const Sidebar: React.FC = () => {
<TextField autoComplete="off" className='border-b border-grey-500 bg-transparent px-3 py-1.5 pl-[24px] text-sm dark:text-white' placeholder="Search" title="Search" value={filter} hideTitle unstyled onChange={updateSearch} />
</div>
<div className="hidden tablet:!visible tablet:!block">
<SettingNavSection title="General">
<SettingNavItem navid='title-and-description' title="Title and description" onClick={handleSectionClick} />
<SettingNavItem navid='timezone' title="Timezone" onClick={handleSectionClick} />
<SettingNavItem navid='publication-language' title="Publication language" onClick={handleSectionClick} />
<SettingNavItem navid='metadata' title="Meta data" onClick={handleSectionClick} />
<SettingNavItem navid='twitter' title="Twitter card" onClick={handleSectionClick} />
<SettingNavItem navid='facebook' title="Facebook card" onClick={handleSectionClick} />
<SettingNavItem navid='social-accounts' title="Social accounts" onClick={handleSectionClick} />
<SettingNavItem navid='locksite' title="Make this site private" onClick={handleSectionClick} />
<SettingNavItem navid='users' title="Staff" onClick={handleSectionClick} />
<SettingNavSection keywords={Object.values(generalSearchKeywords).flat()} title="General">
<SettingNavItem keywords={generalSearchKeywords.titleAndDescription} navid='title-and-description' title="Title and description" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.timeZone} navid='timezone' title="Timezone" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.publicationLanguage} navid='publication-language' title="Publication language" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.metadata} navid='metadata' title="Meta data" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.twitter} navid='twitter' title="Twitter card" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.facebook} navid='facebook' title="Facebook card" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.socialAccounts} navid='social-accounts' title="Social accounts" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.lockSite} navid='locksite' title="Make this site private" onClick={handleSectionClick} />
<SettingNavItem keywords={generalSearchKeywords.users} navid='users' title="Staff" onClick={handleSectionClick} />
</SettingNavSection>
<SettingNavSection title="Site">
{/* <SettingNavItem navid='theme' title="Theme" onClick={handleSectionClick} /> */}
<SettingNavItem navid='design' title="Branding and design" onClick={handleSectionClick} />
<SettingNavItem navid='navigation' title="Navigation" onClick={handleSectionClick} />
<SettingNavItem navid='announcement-bar' title="Announcement bar" onClick={handleSectionClick} />
<SettingNavSection keywords={Object.values(siteSearchKeywords).flat()} title="Site">
<SettingNavItem keywords={siteSearchKeywords.design} navid='design' title="Branding and design" onClick={handleSectionClick} />
<SettingNavItem keywords={siteSearchKeywords.navigation} navid='navigation' title="Navigation" onClick={handleSectionClick} />
<SettingNavItem keywords={siteSearchKeywords.announcementBar} navid='announcement-bar' title="Announcement bar" onClick={handleSectionClick} />
</SettingNavSection>
<SettingNavSection title="Membership">
<SettingNavItem navid='portal' title="Portal" onClick={handleSectionClick} />
<SettingNavItem navid='access' title="Access" onClick={handleSectionClick} />
<SettingNavItem navid='tiers' title="Tiers" onClick={handleSectionClick} />
{hasTipsAndDonations && <SettingNavItem navid='tips-or-donations' title="Tips or donations" onClick={handleSectionClick} />}
<SettingNavItem navid='embed-signup-form' title="Embeddable signup form" onClick={handleSectionClick} />
{hasRecommendations && <SettingNavItem navid='recommendations' title="Recommendations" onClick={handleSectionClick} />}
<SettingNavItem navid='analytics' title="Analytics" onClick={handleSectionClick} />
<SettingNavSection keywords={Object.values(membershipSearchKeywords).flat()} title="Membership">
<SettingNavItem keywords={membershipSearchKeywords.portal} navid='portal' title="Portal" onClick={handleSectionClick} />
<SettingNavItem keywords={membershipSearchKeywords.access} navid='access' title="Access" onClick={handleSectionClick} />
<SettingNavItem keywords={membershipSearchKeywords.tiers} navid='tiers' title="Tiers" onClick={handleSectionClick} />
{hasTipsAndDonations && <SettingNavItem keywords={membershipSearchKeywords.tips} navid='tips-or-donations' title="Tips or donations" onClick={handleSectionClick} />}
<SettingNavItem keywords={membershipSearchKeywords.embedSignupForm} navid='embed-signup-form' title="Embeddable signup form" onClick={handleSectionClick} />
{hasRecommendations && <SettingNavItem keywords={membershipSearchKeywords.recommendations} navid='recommendations' title="Recommendations" onClick={handleSectionClick} />}
<SettingNavItem keywords={membershipSearchKeywords.analytics} navid='analytics' title="Analytics" onClick={handleSectionClick} />
</SettingNavSection>
<SettingNavSection title="Email newsletter">
<SettingNavItem navid='enable-newsletters' title="Newsletter sending" onClick={handleSectionClick} />
<SettingNavSection keywords={Object.values(emailSearchKeywords).flat()} title="Email newsletter">
<SettingNavItem keywords={emailSearchKeywords.enableNewsletters} navid='enable-newsletters' title="Newsletter sending" onClick={handleSectionClick} />
{newslettersEnabled !== 'disabled' && (
<>
<SettingNavItem navid='newsletters' title="Newsletters" onClick={handleSectionClick} />
<SettingNavItem navid='default-recipients' title="Default recipients" onClick={handleSectionClick} />
{!config.mailgunIsConfigured && <SettingNavItem navid='mailgun' title="Mailgun settings" onClick={handleSectionClick} />}
<SettingNavItem keywords={emailSearchKeywords.newsletters} navid='newsletters' title="Newsletters" onClick={handleSectionClick} />
<SettingNavItem keywords={emailSearchKeywords.defaultRecipients} navid='default-recipients' title="Default recipients" onClick={handleSectionClick} />
{!config.mailgunIsConfigured && <SettingNavItem keywords={emailSearchKeywords.mailgun} navid='mailgun' title="Mailgun settings" onClick={handleSectionClick} />}
</>
)}
</SettingNavSection>
<SettingNavSection title="Advanced">
<SettingNavItem navid='integrations' title="Integrations" onClick={handleSectionClick} />
<SettingNavItem navid='code-injection' title="Code injection" onClick={handleSectionClick} />
<SettingNavItem navid='labs' title="Labs" onClick={handleSectionClick} />
<SettingNavItem navid='history' title="History" onClick={handleSectionClick} />
<SettingNavSection keywords={Object.values(advancedSearchKeywords).flat()} title="Advanced">
<SettingNavItem keywords={advancedSearchKeywords.integrations} navid='integrations' title="Integrations" onClick={handleSectionClick} />
<SettingNavItem keywords={advancedSearchKeywords.codeInjection} navid='code-injection' title="Code injection" onClick={handleSectionClick} />
<SettingNavItem keywords={advancedSearchKeywords.labs} navid='labs' title="Labs" onClick={handleSectionClick} />
<SettingNavItem keywords={advancedSearchKeywords.history} navid='history' title="History" onClick={handleSectionClick} />
</SettingNavSection>
</div>
</div>

2
apps/admin-x-settings/src/components/settings/advanced/AdvancedSettings.tsx
View file

@ -5,7 +5,7 @@ import Labs from './Labs';
import React from 'react';
import SettingSection from '../../../admin-x-ds/settings/SettingSection';
const searchKeywords = {
export const searchKeywords = {
integrations: ['integration', 'zapier', 'slack', 'amp', 'unsplash', 'first promoter', 'firstpromoter', 'pintura', 'disqus', 'analytics', 'ulysses', 'typeform', 'buffer', 'plausible', 'github'],
codeInjection: ['newsletter', 'enable', 'disable', 'turn on'],
labs: ['labs', 'alpha', 'beta', 'flag', 'import', 'export', 'migrate', 'routes', 'redirects', 'translation', 'delete'],

2
apps/admin-x-settings/src/components/settings/email/EmailSettings.tsx
View file

@ -7,7 +7,7 @@ import SettingSection from '../../../admin-x-ds/settings/SettingSection';
import {getSettingValues} from '../../../api/settings';
import {useGlobalData} from '../../providers/GlobalDataProvider';
const searchKeywords = {
export const searchKeywords = {
enableNewsletters: ['newsletter', 'enable', 'disable', 'turn on'],
newsletters: ['newsletter', 'email'],
defaultRecipients: ['newsletter', 'default recipients', 'email'],

2
apps/admin-x-settings/src/components/settings/general/GeneralSettings.tsx
View file

@ -11,7 +11,7 @@ import TitleAndDescription from './TitleAndDescription';
import Twitter from './Twitter';
import Users from './Users';
const searchKeywords = {
export const searchKeywords = {
titleAndDescription: ['title and description', 'site title', 'site description'],
timeZone: ['time', 'date', 'site timezone', 'time zone'],
publicationLanguage: ['publication language', 'locale'],

2
apps/admin-x-settings/src/components/settings/membership/MembershipSettings.tsx
View file

@ -9,7 +9,7 @@ import Tiers from './Tiers';
import TipsOrDonations from './TipsOrDonations';
import useFeatureFlag from '../../../hooks/useFeatureFlag';
const searchKeywords = {
export const searchKeywords = {
portal: ['portal', 'signup', 'sign up', 'signin', 'sign in', 'login', 'account', 'membership'],
access: ['default', 'access', 'subscription', 'post', 'membership'],
tiers: ['tiers', 'payment', 'paid'],

2
apps/admin-x-settings/src/components/settings/site/SiteSettings.tsx
View file

@ -4,7 +4,7 @@ import Navigation from './Navigation';
import React from 'react';
import SettingSection from '../../../admin-x-ds/settings/SettingSection';
const searchKeywords = {
export const searchKeywords = {
design: ['design', 'branding', 'logo', 'cover', 'colors', 'fonts', 'background', 'themes', 'appearance', 'style'],
navigation: ['navigation', 'menus', 'primary', 'secondary', 'links'],
announcementBar: ['announcement', 'bar', 'important', 'banner']