58 lines
1.7 KiB
JavaScript
58 lines
1.7 KiB
JavaScript
|
import XrayIcon from 'shared/components/icons/xray.js'
|
||
|
|
import { linkClasses, Chevron } from 'shared/components/navigation/primary.js'
|
||
|
|
import Clear from './clear.js'
|
||
|
|
import Disable from './disable.js'
|
||
|
|
import List from './list.js'
|
||
|
|
|
||
|
|
const Xray = props => {
|
||
|
|
|
||
|
|
return (
|
||
|
|
<details className='py-1' open>
|
||
|
|
<summary className={`
|
||
|
|
flex flex-row gap-4 text-lg
|
||
|
|
hover:cursor-row-resize
|
||
|
|
p-2
|
||
|
|
text-base-content
|
||
|
|
sm:text-neutral-content
|
||
|
|
items-center
|
||
|
|
`}>
|
||
|
|
<span className="text-secondary-focus mr-4"><XrayIcon /></span>
|
||
|
|
{props.gist?.xray?.enabled
|
||
|
|
? (
|
||
|
|
<>
|
||
|
|
<span className={`grow ${linkClasses} hover:cursor-resize font-bold uppercase`}>
|
||
|
|
{props.app.t('settings.xray.title')}
|
||
|
|
</span>
|
||
|
|
<Chevron />
|
||
|
|
</>
|
||
|
|
) : (
|
||
|
|
<>
|
||
|
|
<button
|
||
|
|
className={`grow ${linkClasses} hover:cursor-resize uppercase font-bold text-left`}
|
||
|
|
onClick={() => props.updateGist(['xray', 'enabled'], true)}
|
||
|
|
>
|
||
|
|
{props.app.t('settings.xray.title')}
|
||
|
|
</button>
|
||
|
|
<span className="text-normal text-secondary">
|
||
|
|
{props.app.t('cfp.thingIsDisabled', { thing: props.app.t('settings.xray.title') })}
|
||
|
|
</span>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
</summary>
|
||
|
|
{props.gist?.xray?.enabled && (
|
||
|
|
<ul className="pl-5 list-inside">
|
||
|
|
<Disable {...props} />
|
||
|
|
<Clear {...props} />
|
||
|
|
{
|
||
|
|
props.gist?.xray?.parts &&
|
||
|
|
Object.keys(props.gist.xray.parts).map(partName => <List {...props} partName={partName} />)
|
||
|
|
}
|
||
|
|
</ul>
|
||
|
|
)}
|
||
|
|
</details>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Xray
|