// create-app.tsx
// Copyright (C) 2020 Dwayne Harris
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
// You should have received a copy of the GNU General Public License
// along with this program. If not, see .
import React, { FC, useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { Link, useHistory } from 'react-router-dom'
import { faCheckCircle, faIdCard, faLink, faAddressBook, faCodeBranch } from '@fortawesome/free-solid-svg-icons'
import { checkAppAvailability, createApp } from '../../actions/apps'
import { initForm, initField, setFieldNotification } from '../../actions/forms'
import { showNotification } from '../../actions/notifications'
import { getForm } from '../../selectors/forms'
import { getIsFetching } from '../../selectors/requests'
import { useTheme } from '../../hooks'
import { setTitle, valueFromForm } from '../../utils'
import { AppState, NotificationType, AppThunkDispatch, RequestKey } from '../../types'
import Title from '../../components/title'
import Section from '../../components/section'
import HorizontalRule from '../../components/horizontal-rule'
import PrimaryButton from '../../components/controls/primary-button'
import TextField from '../../components/controls/text-field'
import TextareaField from '../../components/controls/textarea-field'
import CheckboxField from '../../components/controls/checkbox-field'
import ImageField from '../../components/controls/image-field'
import CoverImageField from '../../components/controls/cover-image-field'
import IconImageField from '../../components/controls/icon-image-field'
const CreateApp: FC = () => {
const theme = useTheme()
const form = useSelector(getForm)
const fetching = useSelector(state => getIsFetching(state, RequestKey.CreateApp))
const dispatch = useDispatch()
const history = useHistory()
const checkAvailability = (value: string) => {
if (value.length > 3) {
dispatch(checkAppAvailability(value))
}
}
const handleCreate = async () => {
let invalid = false
const name = valueFromForm(form, 'name')
const about = valueFromForm(form, 'about')
const websiteUrl = valueFromForm(form, 'websiteUrl')
const companyName = valueFromForm(form, 'companyName')
const version = valueFromForm(form, 'version')
const composerUrl = valueFromForm(form, 'composerUrl')
const rendererUrl = valueFromForm(form, 'rendererUrl')
const imageUrl = valueFromForm(form, 'image')
const coverImageUrl = valueFromForm(form, 'coverImage')
const iconImageUrl = valueFromForm(form, 'iconImage')
const agree = valueFromForm(form, 'agree')
if (!name || name === '') {
dispatch(setFieldNotification('name', NotificationType.Error, 'This is required'))
invalid = true
}
if (!version || version === '') {
dispatch(setFieldNotification('version', NotificationType.Error, 'This is required'))
invalid = true
}
if (!agree) {
dispatch(setFieldNotification('agree', NotificationType.Error, 'You must agree to the terms and conditions to continue'))
dispatch(showNotification(NotificationType.Error, 'You must agree to the terms and conditions to continue.'))
invalid = true
}
if (invalid) return
const id = await dispatch(createApp({
name: name!,
version: version!,
about,
websiteUrl,
companyName,
composerUrl,
rendererUrl,
imageUrl,
coverImageUrl,
iconImageUrl,
}))
dispatch(showNotification(NotificationType.Success, 'App created successfully!'))
setTimeout(() => {
history.push(`/a/${id}`)
}, 1000)
}
useEffect(() => {
setTitle('Create a new App')
dispatch(initForm())
dispatch(initField('name', ''))
dispatch(initField('about', ''))
dispatch(initField('websiteUrl', ''))
dispatch(initField('companyName', ''))
dispatch(initField('version', ''))
dispatch(initField('composerUrl', ''))
dispatch(initField('rendererUrl', ''))
dispatch(initField('agree', false))
}, [])
return (
Create a new App checkAvailability(e.target.value)} />
I agree to the Apps terms and conditions.