Closed source UI

frontend/components/software/add/AddSoftwareCard.tsx

@@ -10,6 +10,8 @@ import {useEffect, useState} from 'react'
 import {useRouter} from 'next/router'
 import Button from '@mui/material/Button'
 import Alert from '@mui/material/Alert'
+import FormControlLabel from '@mui/material/FormControlLabel'
+import Switch from '@mui/material/Switch'
 import CircularProgress from '@mui/material/CircularProgress'
 
 import {useForm} from 'react-hook-form'
@@ -35,6 +37,7 @@ type AddSoftwareForm = {
   slug: string,
   brand_name: string,
   short_statement: string|null,
+  closed_source: boolean
 }
 
 let lastValidatedSlug = ''
@@ -52,7 +55,7 @@ export default function AddSoftwareCard() {
   })
   const {errors, isValid} = formState
   // watch for data change in the form
-  const [slug,brand_name,short_statement] = watch(['slug', 'brand_name', 'short_statement'])
+  const [slug,brand_name,short_statement,closed_source] = watch(['slug', 'brand_name', 'short_statement', 'closed_source'])
   // take the last slugValue
   const bouncedSlug = useDebounce(slugValue, 700)
 
@@ -142,6 +145,7 @@ export default function AddSoftwareCard() {
         brand_name: data.brand_name,
         slug: data.slug,
         short_statement: data.short_statement,
+        closed_source: data.closed_source,
         is_published: false,
         description: null,
         description_type: 'markdown',
@@ -252,6 +256,13 @@ export default function AddSoftwareCard() {
             }}
             register={register('slug',config.slug.validation)}
           />
+          <div className="py-4"></div>
+          <FormControlLabel
+            control={
+              <Switch {...register('closed_source')} />
+            }
+            label="Closed Source"
+          />
         </section>
         <section className='flex justify-end'>
           <Button

frontend/components/software/add/addConfig.ts

@@ -39,6 +39,10 @@ export const addConfig = {
         message: 'Restricted input violiation. Use letters, numbers and dashes "-" only between other input.'
       }
     }
+  },
+  closed_source: {
+    label: 'Closed source',
+    validation: {}
   }
 }
 

frontend/components/software/edit/editSoftwareConfig.tsx

@@ -124,6 +124,9 @@ export const softwareInformation = {
   is_published: {
     label: 'Published',
   },
+  closed_source: {
+    label: 'Closed Source'
+  },
   keywords: {
     title: 'Keywords',
     subtitle: 'Find, add or import using concept DOI.',

frontend/components/software/edit/information/SoftwareInformationForm.tsx

@@ -18,6 +18,7 @@ import AutosaveRepositoryUrl from './AutosaveRepositoryUrl'
 import AutosaveSoftwareLicenses from './AutosaveSoftwareLicenses'
 import AutosaveSoftwareMarkdown from './AutosaveSoftwareMarkdown'
 import AutosaveSoftwareLogo from './AutosaveSoftwareLogo'
+import AutosaveSoftwareSwitch from './AutosaveSoftwareSwitch'
 
 type SoftwareInformationFormProviderProps = {
   editSoftware: EditSoftwareItem
@@ -110,6 +111,12 @@ export default function SoftwareInformationForm({editSoftware}: SoftwareInformat
               rules={config.short_statement.validation}
             />
             <div className="py-2"></div>
+            <AutosaveSoftwareSwitch
+              software_id={formData.id}
+              name='closed_source'
+              label={config.closed_source.label}
+              defaultValue={editSoftware.closed_source}
+            />
             <EditSectionTitle
               title='Software URLs'
               subtitle='Where can users find information to start?'

frontend/types/SoftwareTypes.ts

@@ -50,6 +50,7 @@ export type NewSoftwareItem = {
   description_url: string | null,
   description_type: 'markdown'|'link',
   get_started_url: string | null,
+  closed_source: boolean,
   is_published: boolean,
   short_statement: string | null,
   image_id: string | null,
@@ -98,6 +99,7 @@ export const SoftwarePropsToSave = [
   'description_url',
   'get_started_url',
   'image_id',
+  'closed_source',
   'is_published',
   'short_statement'
 ]