fix: ui and chromium compatibility

This commit is contained in:
Taranto 2020-10-22 16:25:22 +01:00 committed by Josh Harvey
parent 00387e0862
commit 7b5c70a958
15 changed files with 66 additions and 45 deletions

View file

@ -18,7 +18,7 @@ if (!name) {
login.generateOTP(name).then(otp => {
if (domain === 'localhost') {
console.log(`https://${domain}:3000/register?otp=${otp}`)
console.log(`https://${domain}:3001/register?otp=${otp}`)
} else {
console.log(`https://${domain}/register?otp=${otp}`)
}

View file

@ -1,15 +0,0 @@
with import (fetchTarball {
name = "nixpkgs-20.09";
url = https://github.com/NixOS/nixpkgs/archive/0b8799ecaaf0dc6b4c11583a3c96ca5b40fcfdfb.tar.gz;
sha256 = "11m4aig6cv0zi3gbq2xn9by29cfvnsxgzf9qsvz67qr0yq29ryyz";
}) {};
stdenv.mkDerivation {
name = "node";
buildInputs = [
nodejs-14_x
];
shellHook = ''
export PATH="$PWD/node_modules/.bin/:$PATH"
'';
}

View file

@ -128,6 +128,9 @@ const Popover = ({
arrow: {
enabled: true,
element: arrowRef
},
computeStyle: {
gpuAcceleration: false
}
})

View file

@ -8,7 +8,7 @@ const styles = {
}),
root: {
'& svg': {
viewbox: null
flex: 1
},
'&:hover': {
backgroundColor: 'inherit'

View file

@ -5,6 +5,7 @@ import React, { useState } from 'react'
import typographyStyles from 'src/components/typography/styles'
import { ReactComponent as Arrow } from 'src/styling/icons/arrow/month_change.svg'
import { ReactComponent as RightArrow } from 'src/styling/icons/arrow/month_change_right.svg'
import { primaryColor, zircon } from 'src/styling/variables'
import Tile from './Tile'
@ -17,6 +18,9 @@ const styles = {
flexDirection: 'column',
alignItems: 'center'
},
button: {
outline: 'none'
},
navbar: {
extend: p,
display: 'flex',
@ -143,7 +147,9 @@ const Calendar = ({ minDate, maxDate, handleSelect, ...props }) => {
return (
<div className={classes.wrapper}>
<div className={classes.navbar}>
<button onClick={() => handleNavPrev(currentDisplayedMonth)}>
<button
className={classes.button}
onClick={() => handleNavPrev(currentDisplayedMonth)}>
<Arrow />
</button>
<span>
@ -151,8 +157,10 @@ const Calendar = ({ minDate, maxDate, handleSelect, ...props }) => {
'MMMM'
)} ${currentDisplayedMonth.format('YYYY')}`}
</span>
<button onClick={() => handleNavNext(currentDisplayedMonth)}>
<Arrow transform="rotate(180)" />
<button
className={classes.button}
onClick={() => handleNavNext(currentDisplayedMonth)}>
<RightArrow />
</button>
</div>
<table className={classes.table}>

View file

@ -22,6 +22,7 @@ const styles = {
overflow: 'hidden'
},
button: {
outline: 'none',
extend: label1,
border: 'none',
cursor: 'pointer',

View file

@ -88,13 +88,7 @@ const ActionCol = ({ disabled, editing }) => {
)
}
const ECol = ({
editing,
focus,
config,
extraPaddingRight,
extraPaddingLeft
}) => {
const ECol = ({ editing, focus, config, extraPaddingRight, extraPadding }) => {
const {
name,
bypassField,
@ -134,7 +128,7 @@ const ECol = ({
<Td
className={{
[classes.extraPaddingRight]: extraPaddingRight,
[classes.extraPaddingLeft]: extraPaddingLeft,
[classes.extraPadding]: extraPadding,
[classes.withSuffix]: suffix
}}
width={width}
@ -189,7 +183,7 @@ const ERow = ({ editing, disabled, lastOfGroup }) => {
const innerElements = shouldStripe ? groupStriped(elements) : elements
const [toSHeader] = R.partition(R.has('doubleHeader'))(elements)
const extraPaddingLeftIndex = toSHeader?.length
const extraPaddingIndex = toSHeader?.length
? R.indexOf(toSHeader[0], elements)
: -1
@ -219,7 +213,7 @@ const ERow = ({ editing, disabled, lastOfGroup }) => {
editing={editing}
focus={idx === elementToFocusIndex && editing}
extraPaddingRight={extraPaddingRightIndex === idx}
extraPaddingLeft={extraPaddingLeftIndex === idx}
extraPadding={extraPaddingIndex === idx}
/>
)
})}

View file

@ -7,11 +7,12 @@ export default {
lastOfGroup: {
marginBottom: 24
},
extraPaddingLeft: {
paddingLeft: 35
extraPadding: {
paddingLeft: 35,
paddingRight: 30
},
extraPaddingRight: {
paddingRight: 45
paddingRight: 39
},
withSuffix: ({ textAlign }) => {
const justifyContent = textAlign === 'right' ? 'end' : textAlign

View file

@ -10,10 +10,10 @@ const AutocompleteFormik = ({ options, onChange, ...props }) => {
const { name, onBlur, value } = props.field
const { touched, errors, setFieldValue, setFieldTouched } = props.form
const error = !!(touched[name] && errors[name])
const { initialValues } = useFormikContext()
const { initialValues, values } = useFormikContext()
const innerOptions =
R.type(options) === 'Function' ? options(initialValues) : options
R.type(options) === 'Function' ? options(initialValues, values) : options
const innerOnBlur = event => {
name && setFieldTouched(name, true)

View file

@ -2,6 +2,7 @@ import { zircon } from 'src/styling/variables'
export default {
expandButton: {
outline: 'none',
border: 'none',
backgroundColor: 'transparent',
cursor: 'pointer',

View file

@ -51,7 +51,12 @@ const Commissions = ({ name: SCREEN_KEY }) => {
)
const commission = config && !R.isEmpty(config) ? config : defaults
const commissionOverrides = commission.overrides ?? []
const commissionOverrides = commission?.overrides ?? []
const orderedCommissionsOverrides = R.sortWith([
R.ascend(it => (R.propEq('machine', 'ALL_MACHINES')(it) ? 0 : 1)),
R.ascend(R.prop('machine'))
])(commissionOverrides)
const save = it => {
const config = toNamespace(SCREEN_KEY)(it.commissions[0])
@ -96,8 +101,8 @@ const Commissions = ({ name: SCREEN_KEY }) => {
initialValues={overridesDefaults}
save={saveOverrides}
validationSchema={OverridesSchema}
data={commissionOverrides}
elements={overrides(data, currency, commissionOverrides)}
data={orderedCommissionsOverrides}
elements={overrides(data, currency, orderedCommissionsOverrides)}
setEditing={onEditingOverrides}
forceDisable={isEditingDefault}
/>

View file

@ -57,7 +57,7 @@ const getOverridesFields = (getData, currency, auxElements) => {
return R.differenceWith(
(x, y) => x.code === y && !it?.cryptoCurrencies.includes(x.code),
cryptoData,
overridenMachineCoins[it?.machine]
overridenMachineCoins[it?.machine] ?? []
)
}
@ -84,7 +84,7 @@ const getOverridesFields = (getData, currency, auxElements) => {
view: displayCodeArray(cryptoData),
input: Autocomplete,
inputProps: {
options: it => suggestionFilter(it, cryptoData),
options: (...[, it]) => suggestionFilter(it, cryptoData),
valueProp: 'code',
getLabel: R.path(['code']),
multiple: true

View file

@ -38,6 +38,12 @@ const allFields = (getData, enableCoin, auxElements = []) => {
const currencyData = getData(['currencies'])
const languageData = getData(['languages'])
const cryptoData = getData(['cryptoCurrencies'])
const findSuggestion = it => {
const machine = R.find(R.propEq('deviceId', it.machine))(machineData)
return machine ? [machine] : []
}
return [
{
name: 'machine',
@ -47,9 +53,7 @@ const allFields = (getData, enableCoin, auxElements = []) => {
input: Autocomplete,
inputProps: {
options: it =>
R.concat(it?.machine ? [it.machine] : [])(
suggestionFilter(machineData)
),
R.concat(findSuggestion(it))(suggestionFilter(machineData)),
valueProp: 'deviceId',
getLabel: R.path(['name'])
}

View file

@ -107,7 +107,7 @@ const Triggers = () => {
marginBottom={2}
className={classes.tableWidth}
display="flex"
justifyContent="end">
justifyContent="flex-end">
{!loading && !R.isEmpty(triggers) && (
<Link color="primary" onClick={() => setWizard(true)}>
+ Add new trigger

View file

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 59.1 (86144) - https://sketch.com -->
<desc>Created with Sketch.</desc>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="pop-up/action/download-logs/date-range-copy-2" transform="translate(-20.000000, -187.000000)">
<g id="icon/sf-contain-b-copy-5" transform="translate(30.000000, 197.000000) rotate(270.000000) translate(-30.000000, -197.000000) translate(20.000000, 187.000000)">
<g id="icon/sf-small/wizzard" stroke-linecap="round" stroke-linejoin="round">
<g transform="translate(6.666667, 6.000000)" id="Group">
<g>
<polyline id="Path-3" stroke="#1B2559" stroke-width="2" points="0 4.83333333 3.33333333 8.16666667 6.66666667 4.83333333"></polyline>
<line x1="3.33333333" y1="0.25" x2="3.33333333" y2="6.5" id="Path-4" stroke="#1B2559" stroke-width="2"></line>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB