diff --git a/new-lamassu-admin/src/pages/Locales/Locales.js b/new-lamassu-admin/src/pages/Locales/Locales.js
index 4539dcbe..e2e999b9 100644
--- a/new-lamassu-admin/src/pages/Locales/Locales.js
+++ b/new-lamassu-admin/src/pages/Locales/Locales.js
@@ -1,30 +1,25 @@
import { useQuery, useMutation } from '@apollo/react-hooks'
import { gql } from 'apollo-boost'
-import React, { memo } from 'react'
-import * as Yup from 'yup'
+import * as R from 'ramda'
+import React from 'react'
-import Subtitle from 'src/components/Subtitle'
-import Title from 'src/components/Title'
+import { Table as EditableTable } from 'src/components/editableTable'
+import Section from 'src/components/layout/Section'
+import TitleSection from 'src/components/layout/TitleSection'
+import { fromServer, toServer } from 'src/utils/config'
-import MainForm from './MainForm'
+import {
+ mainFields,
+ overrides,
+ LocaleSchema,
+ OverridesSchema,
+ localeDefaults,
+ overridesDefaults
+} from './helper'
-const LocaleSchema = Yup.object().shape({
- country: Yup.object().required('Required'),
- fiatCurrency: Yup.object().required('Required'),
- languages: Yup.array().required('Required'),
- cryptoCurrencies: Yup.array().required('Required')
-})
-
-const initialValues = {
- country: null,
- fiatCurrency: null,
- languages: [],
- cryptoCurrencies: [],
- showRates: false
-}
-
-const GET_AUX_DATA = gql`
- {
+const GET_DATA = gql`
+ query getData {
+ config
currencies {
code
display
@@ -41,12 +36,10 @@ const GET_AUX_DATA = gql`
code
display
}
- }
-`
-
-const GET_CONFIG = gql`
- {
- config
+ machines {
+ name
+ deviceId
+ }
}
`
@@ -56,29 +49,55 @@ const SAVE_CONFIG = gql`
}
`
-const Locales = memo(() => {
- const { data } = useQuery(GET_AUX_DATA)
+const Locales = ({ name: SCREEN_KEY }) => {
+ const { data } = useQuery(GET_DATA)
+ const [saveConfig] = useMutation(SAVE_CONFIG, {
+ refetchQueries: () => ['getData']
+ })
- const [saveConfig] = useMutation(SAVE_CONFIG)
- const { data: configResponse } = useQuery(GET_CONFIG)
+ const config = data?.config && fromServer(SCREEN_KEY)(data.config)
- const locale = configResponse?.config ?? initialValues
+ const locale = config && !R.isEmpty(config) ? config : localeDefaults
- const save = it => saveConfig({ variables: { config: it } })
+ const save = it => {
+ const config = toServer(SCREEN_KEY)(it.locale[0])
+ return saveConfig({ variables: { config } })
+ }
+
+ const saveOverrides = it => {
+ const config = toServer(SCREEN_KEY)(it)
+ return saveConfig({ variables: { config } })
+ }
return (
<>
-
Locales
- Default settings
-
- Overrides
+
+
+
>
)
-})
+}
export default Locales
diff --git a/new-lamassu-admin/src/pages/Locales/MainForm.js b/new-lamassu-admin/src/pages/Locales/MainForm.js
deleted file mode 100644
index b69b8736..00000000
--- a/new-lamassu-admin/src/pages/Locales/MainForm.js
+++ /dev/null
@@ -1,74 +0,0 @@
-import * as R from 'ramda'
-import React, { memo } from 'react'
-
-import { Table as EditableTable } from 'src/components/editableTable'
-import { Autocomplete, AutocompleteMultiple } from 'src/components/inputs'
-import { Checkbox } from 'src/components/inputs/formik'
-
-const sizes = {
- country: 200,
- fiatCurrency: 150,
- languages: 240,
- cryptoCurrencies: 270,
- showRates: 125,
- action: 175
-}
-
-const MainForm = memo(({ value, save, auxData, validationSchema }) => {
- const getData = R.path(R.__, auxData)
- const displayCodeArray = R.compose(R.join(', '), R.map(R.path(['code'])))
-
- return (
- {}}
- setEditing={() => {}}
- save={save}
- validationSchema={validationSchema}
- data={R.of(value)}
- elements={[
- {
- name: 'country',
- width: sizes.country,
- view: R.path(['display']),
- input: Autocomplete,
- inputProps: { suggestions: getData(['countries']) }
- },
- {
- name: 'fiatCurrency',
- width: sizes.fiatCurrency,
- view: R.path(['code']),
- input: Autocomplete,
- inputProps: { suggestions: getData(['currencies']) }
- },
- {
- name: 'languages',
- width: sizes.languages,
- view: displayCodeArray,
- input: AutocompleteMultiple,
- inputProps: { suggestions: getData(['languages']) }
- },
- {
- name: 'cryptoCurrencies',
- width: sizes.cryptoCurrencies,
- view: displayCodeArray,
- input: AutocompleteMultiple,
- inputProps: { suggestions: getData(['cryptoCurrencies']) }
- },
- {
- name: 'showRates',
- width: sizes.showRates,
- textAlign: 'center',
- view: it => (it ? 'true' : 'false'),
- input: Checkbox
- }
- ]}
- />
- )
-})
-
-export default MainForm
diff --git a/new-lamassu-admin/src/pages/Locales/Overrides.js b/new-lamassu-admin/src/pages/Locales/Overrides.js
deleted file mode 100644
index 92d4792a..00000000
--- a/new-lamassu-admin/src/pages/Locales/Overrides.js
+++ /dev/null
@@ -1,116 +0,0 @@
-// import React, { useState, memo } from 'react'
-// import { Form, FastField } from 'formik'
-
-// import { Link } from '../../components/buttons'
-// import {
-// Autocomplete,
-// AutocompleteMultiple,
-// Checkbox
-// } from '../../components/inputs'
-// import {
-// EditCell,
-// Table,
-// TableHead,
-// TableRow,
-// TableHeader,
-// TableBody,
-// TableCell as TD
-// } from '../../components/table'
-
-// import styles from './MainForm.module.scss'
-
-// const Override = memo(
-// ({ values, resetForm, submitForm, errors, editing, setEditing, data }) => {
-// const [submitted, setSubmitted] = useState(false)
-
-// const save = () => {
-// setSubmitted(true)
-// submitForm()
-// }
-
-// const cancel = () => {
-// resetForm()
-// setSubmitted(false)
-// setEditing(false)
-// }
-
-// const ViewFields = (
-// <>
-// {values.machine && values.machine.display} |
-//
-// {values.languages && values.languages.map(it => it.code).join(', ')}
-// |
-//
-// {values.cryptoCurrencies &&
-// values.cryptoCurrencies.map(it => it.code).join(', ')}
-// |
-// {values.showRates ? 'true' : 'false'} |
-//
-// setEditing(true)}>
-// Edit
-//
-// |
-// >
-// )
-
-// const EditFields = (
-// <>
-//
-//
-// |
-//
-//
-// |
-//
-//
-// |
-//
-//
-// |
-//
-// >
-// )
-
-// return (
-//
-// )
-// }
-// )
-
-// export default Override
diff --git a/new-lamassu-admin/src/pages/Locales/helper.js b/new-lamassu-admin/src/pages/Locales/helper.js
new file mode 100644
index 00000000..6f20e79e
--- /dev/null
+++ b/new-lamassu-admin/src/pages/Locales/helper.js
@@ -0,0 +1,135 @@
+import * as R from 'ramda'
+import * as Yup from 'yup'
+
+import Autocomplete from 'src/components/inputs/formik/Autocomplete.js'
+
+const displayCodeArray = it => {
+ return it ? R.compose(R.join(', '), R.map(R.path(['code'])))(it) : it
+}
+
+const getFields = (getData, names) => {
+ return R.filter(it => R.includes(it.name, names), allFields(getData))
+}
+
+const allFields = getData => [
+ {
+ name: 'machine',
+ width: 200,
+ size: 'sm',
+ view: R.path(['name']),
+ input: Autocomplete,
+ inputProps: {
+ options: getData(['machines']),
+ limit: null,
+ forceShowValue: true,
+ getOptionSelected: R.eqProps('machineId')
+ }
+ },
+ {
+ name: 'country',
+ width: 200,
+ size: 'sm',
+ view: R.path(['display']),
+ input: Autocomplete,
+ inputProps: {
+ options: getData(['countries']),
+ getOptionSelected: R.eqProps('display')
+ }
+ },
+ {
+ name: 'fiatCurrency',
+ width: 150,
+ size: 'sm',
+ view: R.path(['code']),
+ input: Autocomplete,
+ inputProps: {
+ options: getData(['currencies']),
+ getOptionSelected: R.eqProps('display')
+ }
+ },
+ {
+ name: 'languages',
+ width: 240,
+ size: 'sm',
+ view: displayCodeArray,
+ input: Autocomplete,
+ inputProps: {
+ options: getData(['languages']),
+ getLabel: R.path(['code']),
+ getOptionSelected: R.eqProps('code'),
+ multiple: true
+ }
+ },
+ {
+ name: 'cryptoCurrencies',
+ width: 270,
+ size: 'sm',
+ view: displayCodeArray,
+ input: Autocomplete,
+ inputProps: {
+ options: getData(['cryptoCurrencies']),
+ getLabel: it => R.path(['code'])(it) ?? it,
+ getOptionSelected: R.eqProps('code'),
+ multiple: true
+ }
+ }
+]
+
+const mainFields = auxData => {
+ const getData = R.path(R.__, auxData)
+
+ return getFields(getData, [
+ 'country',
+ 'fiatCurrency',
+ 'languages',
+ 'cryptoCurrencies'
+ ])
+}
+
+const overrides = auxData => {
+ const getData = R.path(R.__, auxData)
+
+ return getFields(getData, [
+ 'machine',
+ 'country',
+ 'languages',
+ 'cryptoCurrencies'
+ ])
+}
+
+const LocaleSchema = Yup.object().shape({
+ country: Yup.object().required('Required'),
+ fiatCurrency: Yup.object().required('Required'),
+ languages: Yup.array().required('Required'),
+ cryptoCurrencies: Yup.array().required('Required')
+})
+
+const OverridesSchema = Yup.object().shape({
+ machine: Yup.object().required('Required'),
+ country: Yup.object().required('Required'),
+ languages: Yup.array().required('Required'),
+ cryptoCurrencies: Yup.array().required('Required')
+})
+
+const localeDefaults = {
+ country: null,
+ fiatCurrency: null,
+ languages: [],
+ cryptoCurrencies: []
+}
+
+const overridesDefaults = {
+ machine: null,
+ country: null,
+ languages: [],
+ cryptoCurrencies: []
+}
+
+export {
+ mainFields,
+ overrides,
+ LocaleSchema,
+ OverridesSchema,
+ localeDefaults,
+ overridesDefaults
+}