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

Addedd static values to access in AdminX Settings

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

View file

@ -18,7 +18,7 @@ interface DropdownProps {
}
const Dropdown: React.FC<DropdownProps> = ({title, options, onSelect, error, hint, defaultSelectedOption}) => {
const [selectedOption, setSelectedOption] = useState('');
const [selectedOption, setSelectedOption] = useState(defaultSelectedOption);
useEffect(() => {
if (defaultSelectedOption) {
@ -34,7 +34,7 @@ const Dropdown: React.FC<DropdownProps> = ({title, options, onSelect, error, hin
return (
<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}>
<option value="">Select an option</option>
{options.map(option => (

View file

@ -16,7 +16,7 @@ interface ITextField {
const TextField: React.FC<ITextField> = ({inputRef, title, value, error, placeholder, hint, onChange, ...props}) => {
return (
<div className='flex flex-col'>
{title && <Heading grey={true} useLabelTag={true}>{title}</Heading>}
{title && <Heading useLabelTag={true}>{title}</Heading>}
<input
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`}`}

View file

@ -1,3 +1,4 @@
import Dropdown from '../../../admin-x-ds/global/Dropdown';
import React, {useState} from 'react';
import SettingGroup from '../../../admin-x-ds/settings/SettingGroup';
import SettingGroupContent from '../../../admin-x-ds/settings/SettingGroupContent';
@ -16,7 +17,7 @@ const Access: React.FC = () => {
{
heading: 'Subscription access',
key: 'subscription-access',
value: 'Anyone'
value: 'Anyone can sign up'
},
{
heading: 'Default post access',
@ -32,9 +33,42 @@ const Access: React.FC = () => {
/>
);
const inputs = (
<SettingGroupContent>
const form = (
<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>
);
@ -45,7 +79,7 @@ const Access: React.FC = () => {
title='Access'
onStateChange={handleStateChange}
>
{currentState === 'view' ? values : inputs}
{currentState === 'view' ? values : form}
</SettingGroup>
);
};