Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-20 22:42:53 -05:00
Code Issues Activity

Addedd static values to access in AdminX Settings

Browse source 
refs. https://github.com/TryGhost/Team/issues/3150
This commit is contained in:
Peter Zimon 2023-05-19 15:33:01 +02:00
parent 05fc1ca810
commit d08e22c0e5
3 changed files with 42 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ghost/admin-x-settings/src/admin-x-ds/global/Dropdown.tsx
View file

@ -18,7 +18,7 @@ interface DropdownProps {
} }
const Dropdown: React.FC<DropdownProps> = ({title, options, onSelect, error, hint, defaultSelectedOption}) => { const Dropdown: React.FC<DropdownProps> = ({title, options, onSelect, error, hint, defaultSelectedOption}) => {
const [selectedOption, setSelectedOption] = useState(''); const [selectedOption, setSelectedOption] = useState(defaultSelectedOption);
useEffect(() => { useEffect(() => {
if (defaultSelectedOption) { if (defaultSelectedOption) {
@ -34,7 +34,7 @@ const Dropdown: React.FC<DropdownProps> = ({title, options, onSelect, error, hin
return ( return (
<div className='flex flex-col'> <div className='flex flex-col'>
{title && <Heading grey={true} useLabelTag={true}>{title}</Heading>} {title && <Heading useLabelTag={true}>{title}</Heading>}
<select className={`-m-1 h-10 border-b ${error ? `border-red` : `border-grey-300 hover:border-grey-500 focus:border-grey-900`} py-2 ${title && `mt-0`}`} value={selectedOption} onChange={handleOptionChange}> <select className={`-m-1 h-10 border-b ${error ? `border-red` : `border-grey-300 hover:border-grey-500 focus:border-grey-900`} py-2 ${title && `mt-0`}`} value={selectedOption} onChange={handleOptionChange}>
<option value="">Select an option</option> <option value="">Select an option</option>
{options.map(option => ( {options.map(option => (

2
ghost/admin-x-settings/src/admin-x-ds/global/TextField.tsx
View file

@ -16,7 +16,7 @@ interface ITextField {
const TextField: React.FC<ITextField> = ({inputRef, title, value, error, placeholder, hint, onChange, ...props}) => { const TextField: React.FC<ITextField> = ({inputRef, title, value, error, placeholder, hint, onChange, ...props}) => {
return ( return (
<div className='flex flex-col'> <div className='flex flex-col'>
{title && <Heading grey={true} useLabelTag={true}>{title}</Heading>} {title && <Heading useLabelTag={true}>{title}</Heading>}
<input <input
ref={inputRef} ref={inputRef}
className={`-mx-1 h-10 border-b ${error ? `border-red` : `border-grey-500 hover:border-grey-600 focus:border-grey-900`} px-1 py-2 ${title && `mt-0`}`} className={`-mx-1 h-10 border-b ${error ? `border-red` : `border-grey-500 hover:border-grey-600 focus:border-grey-900`} px-1 py-2 ${title && `mt-0`}`}

44
ghost/admin-x-settings/src/components/settings/membership/Access.tsx
View file

@ -1,3 +1,4 @@
import Dropdown from '../../../admin-x-ds/global/Dropdown';
import React, {useState} from 'react'; import React, {useState} from 'react';
import SettingGroup from '../../../admin-x-ds/settings/SettingGroup'; import SettingGroup from '../../../admin-x-ds/settings/SettingGroup';
import SettingGroupContent from '../../../admin-x-ds/settings/SettingGroupContent'; import SettingGroupContent from '../../../admin-x-ds/settings/SettingGroupContent';
@ -16,7 +17,7 @@ const Access: React.FC = () => {
{ {
heading: 'Subscription access', heading: 'Subscription access',
key: 'subscription-access', key: 'subscription-access',
value: 'Anyone' value: 'Anyone can sign up'
}, },
{ {
heading: 'Default post access', heading: 'Default post access',
@ -32,9 +33,42 @@ const Access: React.FC = () => {
/> />
); );
const inputs = ( const form = (
<SettingGroupContent> <SettingGroupContent columns={1}>
<Dropdown
defaultSelectedOption='option-1'
hint='Who should be able to subscribe to your site?'
options={[
{value: 'option-1', label: 'Anyone can sign up'},
{value: 'option-2', label: 'Only people I invite'},
{value: 'option-3', label: 'Nobody'}
]}
title="Subscription access"
onSelect={() => {}}
/>
<Dropdown
defaultSelectedOption='option-1'
hint='When a new post is created, who should have access?'
options={[
{value: 'option-1', label: 'Public'},
{value: 'option-2', label: 'Members only'},
{value: 'option-3', label: 'Paid-members only'},
{value: 'option-4', label: 'Specific tears'}
]}
title="Default post access"
onSelect={() => {}}
/>
<Dropdown
defaultSelectedOption='option-1'
hint='Who can comment on posts?'
options={[
{value: 'option-1', label: 'All members'},
{value: 'option-2', label: 'Paid-members only'},
{value: 'option-3', label: 'All members'}
]}
title="Commenting"
onSelect={() => {}}
/>
</SettingGroupContent> </SettingGroupContent>
); );
@ -45,7 +79,7 @@ const Access: React.FC = () => {
title='Access' title='Access'
onStateChange={handleStateChange} onStateChange={handleStateChange}
> >
{currentState === 'view' ? values : inputs} {currentState === 'view' ? values : form}
</SettingGroup> </SettingGroup>
); );
}; };