70 lines
1.9 KiB
TypeScript
70 lines
1.9 KiB
TypeScript
import { DisplayStringForContentType } from '@standardnotes/snjs'
|
|
import Button from '@/Components/Button/Button'
|
|
import { Fragment, FunctionComponent } from 'react'
|
|
import { Title, Text, Subtitle } from '@/Components/Preferences/PreferencesComponents/Content'
|
|
import { AnyExtension } from './AnyExtension'
|
|
import PreferencesSegment from '../../PreferencesComponents/PreferencesSegment'
|
|
|
|
const ConfirmCustomExtension: FunctionComponent<{
|
|
component: AnyExtension
|
|
callback: (confirmed: boolean) => void
|
|
}> = ({ component, callback }) => {
|
|
const fields = [
|
|
{
|
|
label: 'Name',
|
|
value: component.package_info.name,
|
|
},
|
|
{
|
|
label: 'Description',
|
|
value: component.package_info.description,
|
|
},
|
|
{
|
|
label: 'Version',
|
|
value: component.package_info.version,
|
|
},
|
|
{
|
|
label: 'Hosted URL',
|
|
value: component.thirdPartyPackageInfo.url,
|
|
},
|
|
{
|
|
label: 'Download URL',
|
|
value: component.package_info.download_url,
|
|
},
|
|
{
|
|
label: 'Extension Type',
|
|
value: DisplayStringForContentType(component.content_type),
|
|
},
|
|
]
|
|
|
|
return (
|
|
<PreferencesSegment>
|
|
<Title>Confirm Extension</Title>
|
|
|
|
{fields.map((field) => {
|
|
if (!field.value) {
|
|
return undefined
|
|
}
|
|
return (
|
|
<Fragment key={field.value}>
|
|
<Subtitle>{field.label}</Subtitle>
|
|
<Text className={'wrap'}>{field.value}</Text>
|
|
<div className="min-h-2" />
|
|
</Fragment>
|
|
)
|
|
})}
|
|
|
|
<div className="min-h-3" />
|
|
|
|
<div className="flex flex-row">
|
|
<Button className="min-w-20" variant="normal" label="Cancel" onClick={() => callback(false)} />
|
|
|
|
<div className="min-w-3" />
|
|
|
|
<Button className="min-w-20" variant="normal" label="Install" onClick={() => callback(true)} />
|
|
</div>
|
|
</PreferencesSegment>
|
|
)
|
|
}
|
|
|
|
export default ConfirmCustomExtension
|