LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Merge branch 'master' into master

Browse source
This commit is contained in:
Baltazar Gomez 2017-08-06 18:58:50 -06:00 committed by GitHub
commit da92061ee9
23 changed files with 512 additions and 299 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored
View file

@ -13,6 +13,7 @@
/app/node_modules
/build/venv
/lbry-app-venv
/lbry-app
/lbry-venv
/daemon/build
/daemon/venv

10
CHANGELOG.md
View file

@ -8,15 +8,17 @@ Web UI version numbers should always match the corresponding version of LBRY App
## [Unreleased]
### Added
*
* Added a new component, `FormFieldPrice` which is now used in Publish and Settings
*
### Changed
*
* Some form field refactoring as we progress towards form sanity.
* When an "Open" button is clicked on a show page, if the file fails to open, the app will try to open the file's folder.
*
### Fixed
*
* Tiles will no longer be blurry on hover (Windows only bug)
* Removed placeholder values from price selection form fields, which was causing confusion that these were real values (#426)
*
### Deprecated
@ -24,7 +26,7 @@ Web UI version numbers should always match the corresponding version of LBRY App
*
### Removed
*
* Removed the label "Max Purchase Price" from settings page. It was redundant.
*
## [0.14.3] - 2017-08-03

4
package.json
View file

@ -57,8 +57,8 @@
},
"devDependencies": {
"devtron": "^1.4.0",
"electron": "^1.4.15",
"electron": "^1.7.5",
"electron-builder": "^11.7.0",
"electron-debug": "^1.1.0"
"electron-debug": "^1.4.0"
}
}

5
ui/js/actions/file_info.js
View file

@ -72,7 +72,10 @@ export function doFileList() {
export function doOpenFileInShell(fileInfo) {
return function(dispatch, getState) {
shell.openItem(fileInfo.download_path);
const success = shell.openItem(fileInfo.download_path);
if (!success) {
dispatch(doOpenFileInFolder(fileInfo));
}
};
}

2
ui/js/component/fileList/view.jsx
View file

@ -2,7 +2,7 @@ import React from "react";
import lbry from "lbry.js";
import lbryuri from "lbryuri.js";
import Link from "component/link";
import { FormField } from "component/form.js";
import FormField from "component/formField";
import FileTile from "component/fileTile";
import rewards from "rewards.js";
import lbryio from "lbryio.js";

202
ui/js/component/form.js
View file

@ -1,183 +1,14 @@
import React from "react";
import FileSelector from "./file-selector.js";
import SimpleMDE from "react-simplemde-editor";
import style from "react-simplemde-editor/dist/simplemde.min.css";
import FormField from "component/formField";
let formFieldCounter = 0,
formFieldFileSelectorTypes = ["file", "directory"],
formFieldNestedLabelTypes = ["radio", "checkbox"];
let formFieldCounter = 0;
function formFieldId() {
export const formFieldNestedLabelTypes = ["radio", "checkbox"];
export function formFieldId() {
return "form-field-" + ++formFieldCounter;
}
export class FormField extends React.PureComponent {
static propTypes = {
type: React.PropTypes.string.isRequired,
prefix: React.PropTypes.string,
postfix: React.PropTypes.string,
hasError: React.PropTypes.bool,
};
constructor(props) {
super(props);
this._fieldRequiredText = __("This field is required");
this._type = null;
this._element = null;
this._extraElementProps = {};
this.state = {
isError: null,
errorMessage: null,
};
}
componentWillMount() {
if (["text", "number", "radio", "checkbox"].includes(this.props.type)) {
this._element = "input";
this._type = this.props.type;
} else if (this.props.type == "text-number") {
this._element = "input";
this._type = "text";
} else if (this.props.type == "SimpleMDE") {
this._element = SimpleMDE;
this._type = "textarea";
this._extraElementProps.options = {
hideIcons: ["guide", "heading", "image", "fullscreen", "side-by-side"],
};
} else if (formFieldFileSelectorTypes.includes(this.props.type)) {
this._element = "input";
this._type = "hidden";
} else {
// Non <input> field, e.g. <select>, <textarea>
this._element = this.props.type;
}
}
componentDidMount() {
/**
* We have to add the webkitdirectory attribute here because React doesn't allow it in JSX
* https://github.com/facebook/react/issues/3468
*/
if (this.props.type == "directory") {
this.refs.field.webkitdirectory = true;
}
}
handleFileChosen(path) {
this.refs.field.value = path;
if (this.props.onChange) {
// Updating inputs programmatically doesn't generate an event, so we have to make our own
const event = new Event("change", { bubbles: true });
this.refs.field.dispatchEvent(event); // This alone won't generate a React event, but we use it to attach the field as a target
this.props.onChange(event);
}
}
showError(text) {
this.setState({
isError: true,
errorMessage: text,
});
}
focus() {
this.refs.field.focus();
}
getValue() {
if (this.props.type == "checkbox") {
return this.refs.field.checked;
} else if (this.props.type == "SimpleMDE") {
return this.refs.field.simplemde.value();
} else {
return this.refs.field.value;
}
}
getSelectedElement() {
return this.refs.field.options[this.refs.field.selectedIndex];
}
getOptions() {
return this.refs.field.options;
}
render() {
// Pass all unhandled props to the field element
const otherProps = Object.assign({}, this.props),
isError = this.state.isError !== null
? this.state.isError
: this.props.hasError,
elementId = this.props.id ? this.props.id : formFieldId(),
renderElementInsideLabel =
this.props.label && formFieldNestedLabelTypes.includes(this.props.type);
delete otherProps.type;
delete otherProps.label;
delete otherProps.hasError;
delete otherProps.className;
delete otherProps.postfix;
delete otherProps.prefix;
const element = (
<this._element
id={elementId}
type={this._type}
name={this.props.name}
ref="field"
placeholder={this.props.placeholder}
className={
"form-field__input form-field__input-" +
this.props.type +
" " +
(this.props.className || "") +
(isError ? "form-field__input--error" : "")
}
{...otherProps}
{...this._extraElementProps}
>
{this.props.children}
</this._element>
);
return (
<div className={"form-field form-field--" + this.props.type}>
{this.props.prefix
? <span className="form-field__prefix">{this.props.prefix}</span>
: ""}
{renderElementInsideLabel
? <label
htmlFor={elementId}
className={
"form-field__label " +
(isError ? "form-field__label--error" : "")
}
>
{element}
{this.props.label}
</label>
: element}
{formFieldFileSelectorTypes.includes(this.props.type)
? <FileSelector
type={this.props.type}
onFileChosen={this.handleFileChosen.bind(this)}
{...(this.props.defaultValue
? { initPath: this.props.defaultValue }
: {})}
/>
: null}
{this.props.postfix
? <span className="form-field__postfix">{this.props.postfix}</span>
: ""}
{isError && this.state.errorMessage
? <div className="form-field__error">{this.state.errorMessage}</div>
: ""}
</div>
);
}
}
export class FormRow extends React.PureComponent {
static propTypes = {
label: React.PropTypes.oneOfType([
@ -194,6 +25,8 @@ export class FormRow extends React.PureComponent {
constructor(props) {
super(props);
this._field = null;
this._fieldRequiredText = __("This field is required");
this.state = this.getStateFromProps(props);
@ -233,19 +66,24 @@ export class FormRow extends React.PureComponent {
}
getValue() {
return this.refs.field.getValue();
return this._field.getValue();
}
getSelectedElement() {
return this.refs.field.getSelectedElement();
return this._field.getSelectedElement();
}
getOptions() {
return this.refs.field.getOptions();
if (!this._field || !this._field.getOptions) {
console.log(this);
console.log(this._field);
console.log(this._field.getOptions);
}
return this._field.getOptions();
}
focus() {
this.refs.field.focus();
this._field.focus();
}
render() {
@ -281,7 +119,13 @@ export class FormRow extends React.PureComponent {
</label>
</div>
: ""}
<FormField ref="field" hasError={this.state.isError} {...fieldProps} />
<FormField
ref={ref => {
this._field = ref ? ref.getWrappedInstance() : null;
}}
hasError={this.state.isError}
{...fieldProps}
/>
{!this.state.isError && this.props.helper
? <div className="form-field__helper">{this.props.helper}</div>
: ""}

5
ui/js/component/formField/index.js Normal file
View file

@ -0,0 +1,5 @@
import React from "react";
import { connect } from "react-redux";
import FormField from "./view";
export default connect(null, null, null, { withRef: true })(FormField);

178
ui/js/component/formField/view.jsx Normal file
View file

@ -0,0 +1,178 @@
import React from "react";
import FileSelector from "component/file-selector.js";
import SimpleMDE from "react-simplemde-editor";
import { formFieldNestedLabelTypes, formFieldId } from "../form";
import style from "react-simplemde-editor/dist/simplemde.min.css";
const formFieldFileSelectorTypes = ["file", "directory"];
class FormField extends React.PureComponent {
static propTypes = {
type: React.PropTypes.string.isRequired,
prefix: React.PropTypes.string,
postfix: React.PropTypes.string,
hasError: React.PropTypes.bool,
};
constructor(props) {
super(props);
this._fieldRequiredText = __("This field is required");
this._type = null;
this._element = null;
this._extraElementProps = {};
this.state = {
isError: null,
errorMessage: null,
};
}
componentWillMount() {
if (["text", "number", "radio", "checkbox"].includes(this.props.type)) {
this._element = "input";
this._type = this.props.type;
} else if (this.props.type == "text-number") {
this._element = "input";
this._type = "text";
} else if (this.props.type == "SimpleMDE") {
this._element = SimpleMDE;
this._type = "textarea";
this._extraElementProps.options = {
hideIcons: ["guide", "heading", "image", "fullscreen", "side-by-side"],
};
} else if (formFieldFileSelectorTypes.includes(this.props.type)) {
this._element = "input";
this._type = "hidden";
} else {
// Non <input> field, e.g. <select>, <textarea>
this._element = this.props.type;
}
}
componentDidMount() {
/**
* We have to add the webkitdirectory attribute here because React doesn't allow it in JSX
* https://github.com/facebook/react/issues/3468
*/
if (this.props.type == "directory") {
this.refs.field.webkitdirectory = true;
}
}
handleFileChosen(path) {
this.refs.field.value = path;
if (this.props.onChange) {
// Updating inputs programmatically doesn't generate an event, so we have to make our own
const event = new Event("change", { bubbles: true });
this.refs.field.dispatchEvent(event); // This alone won't generate a React event, but we use it to attach the field as a target
this.props.onChange(event);
}
}
showError(text) {
this.setState({
isError: true,
errorMessage: text,
});
}
focus() {
this.refs.field.focus();
}
getValue() {
if (this.props.type == "checkbox") {
return this.refs.field.checked;
} else if (this.props.type == "SimpleMDE") {
return this.refs.field.simplemde.value();
} else {
return this.refs.field.value;
}
}
getSelectedElement() {
return this.refs.field.options[this.refs.field.selectedIndex];
}
getOptions() {
return this.refs.field.options;
}
render() {
// Pass all unhandled props to the field element
const otherProps = Object.assign({}, this.props),
isError = this.state.isError !== null
? this.state.isError
: this.props.hasError,
elementId = this.props.elementId ? this.props.elementId : formFieldId(),
renderElementInsideLabel =
this.props.label && formFieldNestedLabelTypes.includes(this.props.type);
delete otherProps.type;
delete otherProps.label;
delete otherProps.hasError;
delete otherProps.className;
delete otherProps.postfix;
delete otherProps.prefix;
delete otherProps.dispatch;
const element = (
<this._element
id={elementId}
type={this._type}
name={this.props.name}
ref="field"
placeholder={this.props.placeholder}
className={
"form-field__input form-field__input-" +
this.props.type +
" " +
(this.props.className || "") +
(isError ? "form-field__input--error" : "")
}
{...otherProps}
{...this._extraElementProps}
>
{this.props.children}
</this._element>
);
return (
<div className={"form-field form-field--" + this.props.type}>
{this.props.prefix
? <span className="form-field__prefix">{this.props.prefix}</span>
: ""}
{renderElementInsideLabel
? <label
htmlFor={elementId}
className={
"form-field__label " +
(isError ? "form-field__label--error" : "")
}
>
{element}
{this.props.label}
</label>
: element}
{formFieldFileSelectorTypes.includes(this.props.type)
? <FileSelector
type={this.props.type}
onFileChosen={this.handleFileChosen.bind(this)}
{...(this.props.defaultValue
? { initPath: this.props.defaultValue }
: {})}
/>
: null}
{this.props.postfix
? <span className="form-field__postfix">{this.props.postfix}</span>
: ""}
{isError && this.state.errorMessage
? <div className="form-field__error">{this.state.errorMessage}</div>
: ""}
</div>
);
}
}
export default FormField;

5
ui/js/component/formFieldPrice/index.js Normal file
View file

@ -0,0 +1,5 @@
import React from "react";
import { connect } from "react-redux";
import FormFieldPrice from "./view";
export default connect(null, null)(FormFieldPrice);

68
ui/js/component/formFieldPrice/view.jsx Normal file
View file

@ -0,0 +1,68 @@
import React from "react";
import FormField from "component/formField";
class FormFieldPrice extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
amount: props.defaultValue && props.defaultValue.amount
? props.defaultValue.amount
: "",
currency: props.defaultValue && props.defaultValue.currency
? props.defaultValue.currency
: "LBC",
};
}
dispatchChange() {
this.props.onChange({
amount: this.state.amount,
currency: this.state.currency,
});
}
handleFeeAmountChange(event) {
this.state.amount = event.target.value ? Number(event.target.value) : null;
this.dispatchChange();
}
handleFeeCurrencyChange(event) {
this.state.currency = event.target.value;
this.dispatchChange();
}
render() {
const { defaultValue, placeholder, min, step } = this.props;
return (
<span className="form-field">
<FormField
type="number"
name="amount"
min={min}
placeholder={placeholder || null}
step={step}
onChange={event => this.handleFeeAmountChange(event)}
defaultValue={
defaultValue && defaultValue.amount ? defaultValue.amount : ""
}
className="form-field__input--inline"
/>
<FormField
type="select"
name="currency"
onChange={event => this.handleFeeCurrencyChange(event)}
defaultValue={
defaultValue && defaultValue.currency ? defaultValue.currency : ""
}
className="form-field__input--inline"
>
<option value="LBC">{__("LBRY Credits (LBC)")}</option>
<option value="USD">{__("US Dollars")}</option>
</FormField>
</span>
);
}
}
export default FormFieldPrice;

2
ui/js/component/modalRemoveFile/view.jsx
View file

@ -1,6 +1,6 @@
import React from "react";
import { Modal } from "component/modal";
import { FormField } from "component/form.js";
import FormField from "component/formField";
class ModalRemoveFile extends React.PureComponent {
constructor(props) {

5
ui/js/component/priceForm/index.js Normal file
View file

@ -0,0 +1,5 @@
import React from "react";
import { connect } from "react-redux";
import FormFieldPrice from "./view";
export default connect(null, null)(FormFieldPrice);

71
ui/js/component/priceForm/view.jsx Normal file
View file

@ -0,0 +1,71 @@
import React from "react";
import FormField from "component/formField";
class FormFieldPrice extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
price: {
feeAmount: "",
feeCurrency: "LBC",
},
};
}
handleFeeAmountChange(event) {
this.setState({
price: {
...this.state.price,
feeAmount: event.target.value,
},
});
this.props.onChange(event.target.name, this.state.price);
}
handleFeeCurrencyChange(event) {
this.setState({
price: {
...this.state.price,
feeCurrency: event.target.value,
},
});
this.props.onChange(event.target.name, this.state.price);
}
render() {
const {
defaultAmount,
defaultCurrency,
placeholder,
min,
step,
} = this.props;
return (
<span className={"form-field "}>
<FormField
type="number"
name="amount"
min={min}
placeholder={placeholder || null}
step={step}
onChange={event => this.handleFeeAmountChange(event)}
defaultValue={defaultAmount}
className="form-field__input--inline"
/>
<FormField
type="select"
name="currency"
onChange={event => this.handleFeeCurrencyChange(event)}
defaultValue={defaultCurrency}
className="form-field__input--inline"
>
<option value="LBC">{__("LBRY credits")}</option>
<option value="USD">{__("US Dollars")}</option>
</FormField>
</span>
);
}
}
export default FormFieldPrice;

2
ui/js/component/publishForm/index.js
View file

@ -2,4 +2,4 @@ import React from "react";
import { connect } from "react-redux";
import PublishForm from "./view";
export default connect()(PublishForm);
export default connect(null, null)(PublishForm);

7
ui/js/component/publishForm/internal/channelSection.jsx
View file

@ -1,6 +1,6 @@
import React from "react";
import lbryuri from "lbryuri";
import { FormField, FormRow } from "component/form.js";
import { FormRow } from "component/form.js";
import { BusyMessage } from "component/common";
import Link from "component/link";
@ -127,7 +127,10 @@ class ChannelSection extends React.PureComponent {
<div className="card__title-primary">
<h4>{__("Channel Name")}</h4>
<div className="card__subtitle">
{__("This is the channel that broadcasts your content.")}
{__(
"This is a username or handle that your content can be found under."
)}
{" "}
{__("Ex. @Marvel, @TheBeatles, @BooksByJoe")}
</div>
</div>

55
ui/js/component/publishForm/view.jsx
View file

@ -1,8 +1,10 @@
import React from "react";
import lbry from "lbry";
import lbryuri from "lbryuri";
import { FormField, FormRow } from "component/form.js";
import FormField from "component/formField";
import { FormRow } from "component/form.js";
import Link from "component/link";
import FormFieldPrice from "component/formFieldPrice";
import Modal from "component/modal";
import { BusyMessage } from "component/common";
import ChannelSection from "./internal/channelSection";
@ -21,7 +23,7 @@ class PublishForm extends React.PureComponent {
bid: 10,
hasFile: false,
feeAmount: "",
feeCurrency: "USD",
feeCurrency: "LBC",
channel: "anonymous",
newChannelName: "@",
newChannelBid: 10,
@ -124,7 +126,7 @@ class PublishForm extends React.PureComponent {
this.props.publish(publishArgs).then(success, failure);
};
if (this.state.isFee) {
if (this.state.isFee && parseFloat(this.state.feeAmount) > 0) {
lbry.wallet_unused_address().then(address => {
metadata.fee = {
currency: this.state.feeCurrency,
@ -306,21 +308,15 @@ class PublishForm extends React.PureComponent {
});
}
handleFeeAmountChange(event) {
this.setState({
feeAmount: event.target.value,
});
}
handleFeeCurrencyChange(event) {
this.setState({
feeCurrency: event.target.value,
});
handleFeeChange(newValue) {
this.state.feeAmount = newValue.amount;
this.state.feeCurrency = newValue.currency;
}
handleFeePrefChange(feeEnabled) {
this.setState({
isFee: feeEnabled,
feeAmount: this.state.feeAmount == "" ? "5.00" : this.state.feeAmount,
});
}
@ -666,31 +662,26 @@ class PublishForm extends React.PureComponent {
checked={this.state.isFee}
/>
<span className={!this.state.isFee ? "hidden" : ""}>
<FormField
type="number"
className="form-field__input--inline"
step="0.01"
placeholder="1.00"
min="0.01"
onChange={event => this.handleFeeAmountChange(event)}
/>{" "}
<FormField
type="select"
onChange={event => {
this.handleFeeCurrencyChange(event);
}}
>
<option value="USD">{__("US Dollars")}</option>
<option value="LBC">{__("LBRY credits")}</option>
</FormField>
{/*min=0.01 caused weird interactions with step (e.g. down from 5 equals 4.91 rather than 4.9) */}
<FormFieldPrice
min="0"
step="0.1"
defaultValue={{ amount: 5.0, currency: "LBC" }}
onChange={val => this.handleFeeChange(val)}
/>
</span>
{/*
&& this.state.feeCurrency.toUpperCase() != "LBC"
for some reason, react does not trigger a re-render on currency change (despite trigger a state change), so
the above logic cannot be added to the below check
*/}
{this.state.isFee
? <div className="form-field__helper">
{__(
"If you choose to price this content in dollars, the number of credits charged will be adjusted based on the value of LBRY credits at the time of purchase."
"All content fees are charged in LBC. For non-LBC payment methods, the number of credits charged will be adjusted based on the value of LBRY credits at the time of purchase."
)}
</div>
: ""}
: null}
<FormRow
label="License"
type="select"

2
ui/js/page/developer.js
View file

@ -1,6 +1,6 @@
import lbry from "../lbry.js";
import React from "react";
import { FormField } from "../component/form.js";
import FormField from "component/formField";
import Link from "../component/link";
const fs = require("fs");

5
ui/js/page/fileListDownloaded/view.jsx
View file

@ -1,11 +1,6 @@
import React from "react";
import lbry from "lbry.js";
import lbryuri from "lbryuri.js";
import Link from "component/link";
import { FormField } from "component/form.js";
import { FileTile } from "component/fileTile";
import rewards from "rewards.js";
import lbryio from "lbryio.js";
import { BusyMessage, Thumbnail } from "component/common.js";
import FileList from "component/fileList";
import SubHeader from "component/subHeader";

5
ui/js/page/fileListPublished/view.jsx
View file

@ -1,11 +1,6 @@
import React from "react";
import lbry from "lbry.js";
import lbryuri from "lbryuri.js";
import Link from "component/link";
import { FormField } from "component/form.js";
import FileTile from "component/fileTile";
import rewards from "rewards.js";
import lbryio from "lbryio.js";
import { BusyMessage, Thumbnail } from "component/common.js";
import FileList from "component/fileList";
import SubHeader from "component/subHeader";

64
ui/js/page/settings/view.jsx
View file

@ -1,8 +1,10 @@
import React from "react";
import { FormField, FormRow } from "component/form.js";
import FormField from "component/formField";
import { FormRow } from "component/form.js";
import SubHeader from "component/subHeader";
import lbry from "lbry.js";
import Link from "component/link";
import FormFieldPrice from "component/formFieldPrice";
import { remote } from "electron";
class SettingsPage extends React.PureComponent {
@ -59,26 +61,8 @@ class SettingsPage extends React.PureComponent {
this.setDaemonSetting("download_directory", event.target.value);
}
onKeyFeeChange(event) {
var oldSettings = this.props.daemonSettings.max_key_fee;
var newSettings = {
amount: oldSettings.amount,
currency: oldSettings.currency,
};
newSettings.amount = Number(event.target.value);
this.setDaemonSetting("max_key_fee", newSettings);
}
onFeeCurrencyChange(event) {
var oldSettings = this.props.daemonSettings.max_key_fee;
var newSettings = {
amount: oldSettings.amount,
currency: oldSettings.currency,
};
newSettings.currency = event.target.value;
this.setDaemonSetting("max_key_fee", newSettings);
onKeyFeeChange(newValue) {
this.setDaemonSetting("max_key_fee", newValue);
}
onKeyFeeDisableChange(isDisabled) {
@ -163,11 +147,6 @@ class SettingsPage extends React.PureComponent {
<h3>{__("Max Purchase Price")}</h3>
</div>
<div className="card__content">
<div className="form-row__label-row">
<div className="form-field__label">
{__("Max Purchase Price")}
</div>
</div>
<FormRow
type="radio"
name="max_key_fee"
@ -191,28 +170,17 @@ class SettingsPage extends React.PureComponent {
: __("Limit to")
}
/>
{!daemonSettings.disable_max_key_fee
? <FormField
type="number"
min="0"
placeholder="50"
step="1"
onChange={this.onKeyFeeChange.bind(this)}
defaultValue={daemonSettings.max_key_fee.amount}
className="form-field__input--inline"
/>
: ""}
{!daemonSettings.disable_max_key_fee
? <FormField
type="select"
onChange={this.onFeeCurrencyChange.bind(this)}
defaultValue={daemonSettings.max_key_fee.currency}
className="form-field__input--inline"
>
<option value="USD">{__("US Dollars")}</option>
<option value="LBC">{__("LBRY credits")}</option>
</FormField>
: ""}
{!daemonSettings.disable_max_key_fee &&
<FormFieldPrice
min="0"
step="1"
onChange={this.onKeyFeeChange.bind(this)}
defaultValue={
daemonSettings.max_key_fee
? daemonSettings.max_key_fee
: { currency: "USD", amount: 50 }
}
/>}
</div>
<div className="form-field__helper">
{__(

2
ui/js/selectors/settings.js
View file

@ -4,7 +4,7 @@ const _selectState = state => state.settings || {};
export const selectDaemonSettings = createSelector(
_selectState,
state => state.daemonSettings || {}
state => state.daemonSettings
);
export const selectClientSettings = createSelector(

4
ui/scss/component/_card.scss
View file

@ -97,13 +97,13 @@ $card-link-scaling: 1.1;
position: relative;
z-index: 1;
box-shadow: $box-shadow-focus;
transform: scale($card-link-scaling) translate3d($translate-card-hover, 0, 0);
transform: scale($card-link-scaling) translateX($translate-card-hover);
transform-origin: 50% 50%;
overflow-x: visible;
overflow-y: visible
}
.card--link:hover ~ .card--link {
transform: translate3d($translate-card-hover * 2, 0, 0);
transform: translateX($translate-card-hover * 2);
}
.card__media {

107
yarn.lock
View file

@ -243,6 +243,22 @@ concat-stream@1.6.0:
readable-stream "^2.2.2"
typedarray "^0.0.6"
concordance@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/concordance/-/concordance-2.0.0.tgz#c3c5dbffa83c29537df202bded8fa1d6aa94e805"
dependencies:
esutils "^2.0.2"
fast-diff "^1.1.1"
function-name-support "^0.2.0"
js-string-escape "^1.0.1"
lodash.clonedeep "^4.5.0"
lodash.flattendeep "^4.4.0"
lodash.merge "^4.6.0"
md5-hex "^2.0.0"
moment "^2.18.1"
semver "^5.3.0"
well-known-symbols "^1.0.0"
configstore@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/configstore/-/configstore-2.1.0.tgz#737a3a7036e9886102aa6099e47bb33ab1aba1a1"
@ -405,12 +421,12 @@ electron-builder@^11.7.0:
uuid-1345 "^0.99.6"
yargs "^6.6.0"
electron-debug@^1.1.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/electron-debug/-/electron-debug-1.2.0.tgz#22e51a73e1bf095d0bb51a6c3d97a203364c4222"
electron-debug@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/electron-debug/-/electron-debug-1.4.0.tgz#bec7005522220a9d0622153352e1bbff0f37af2e"
dependencies:
electron-is-dev "^0.1.0"
electron-localshortcut "^2.0.0"
electron-is-dev "^0.3.0"
electron-localshortcut "^3.0.0"
electron-download-tf@3.1.0:
version "3.1.0"
@ -443,16 +459,19 @@ electron-is-accelerator@^0.1.0:
version "0.1.2"
resolved "https://registry.yarnpkg.com/electron-is-accelerator/-/electron-is-accelerator-0.1.2.tgz#509e510c26a56b55e17f863a4b04e111846ab27b"
electron-is-dev@^0.1.0:
version "0.1.2"
resolved "https://registry.yarnpkg.com/electron-is-dev/-/electron-is-dev-0.1.2.tgz#8a1043e32b3a1da1c3f553dce28ce764246167e3"
electron-is-dev@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/electron-is-dev/-/electron-is-dev-0.3.0.tgz#14e6fda5c68e9e4ecbeff9ccf037cbd7c05c5afe"
electron-localshortcut@^2.0.0:
version "2.0.2"
resolved "https://registry.yarnpkg.com/electron-localshortcut/-/electron-localshortcut-2.0.2.tgz#6a1adcd6514c957328ec7912f5ccb5e1c10706db"
electron-localshortcut@^3.0.0:
version "3.0.1"
resolved "https://registry.yarnpkg.com/electron-localshortcut/-/electron-localshortcut-3.0.1.tgz#cefc1bdbe897defc2e6d9c62c657353cfaefcb91"
dependencies:
debug "^2.6.8"
electron-is-accelerator "^0.1.0"
insp "^0.1.0"
keyboardevent-from-electron-accelerator "^0.7.0"
keyboardevents-areequal "^0.2.1"
electron-macos-sign@~1.5.0:
version "1.5.0"
@ -464,9 +483,9 @@ electron-macos-sign@~1.5.0:
isbinaryfile "^3.0.2"
plist "^2.0.1"
electron@^1.4.15:
version "1.7.3"
resolved "https://registry.yarnpkg.com/electron/-/electron-1.7.3.tgz#839cab0a0598835a100dceede215988ba99c325b"
electron@^1.7.5:
version "1.7.5"
resolved "https://registry.yarnpkg.com/electron/-/electron-1.7.5.tgz#065a3102bf8b87102df50c50985fefe6c569045b"
dependencies:
"@types/node" "^7.0.18"
electron-download "^3.0.1"
@ -490,6 +509,10 @@ esprima@^3.1.1:
version "3.1.3"
resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
esutils@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
extend@~3.0.0:
version "3.0.1"
resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.1.tgz#a755ea7bc1adfcc5a31ce7e762dbaadc5e636444"
@ -507,6 +530,10 @@ extsprintf@1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.0.2.tgz#e1080e0658e300b06294990cc70e1502235fd550"
fast-diff@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.1.1.tgz#0aea0e4e605b6a2189f0e936d4b7fbaf1b7cfd9b"
fd-slicer@~1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.0.1.tgz#8b5bcbd9ec327c5041bf9ab023fd6750f1177e65"
@ -572,6 +599,10 @@ fs.realpath@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
function-name-support@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/function-name-support/-/function-name-support-0.2.0.tgz#55d3bfaa6eafd505a50f9bc81fdf57564a0bb071"
get-caller-file@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-1.0.2.tgz#f702e63127e7e231c160a80c1554acb70d5047e5"
@ -704,6 +735,12 @@ ini@^1.3.4, ini@~1.3.0:
version "1.3.4"
resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.4.tgz#0537cb79daf59b59a1a517dff706c86ec039162e"
insp@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/insp/-/insp-0.1.0.tgz#1a532c78664745dbb1d2c08e39f8d4832ab26349"
dependencies:
concordance "^2.0.0"
invert-kv@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6"
@ -780,6 +817,10 @@ isstream@~0.1.2:
version "0.1.2"
resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
js-string-escape@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/js-string-escape/-/js-string-escape-1.0.1.tgz#e2625badbc0d67c7533e9edc1068c587ae4137ef"
js-yaml@^3.7.0:
version "3.8.4"
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.8.4.tgz#520b4564f86573ba96662af85a8cafa7b4b5a6f6"
@ -824,6 +865,14 @@ jsprim@^1.2.2:
json-schema "0.2.3"
verror "1.3.6"
keyboardevent-from-electron-accelerator@^0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/keyboardevent-from-electron-accelerator/-/keyboardevent-from-electron-accelerator-0.7.0.tgz#0532545ac08ce2dd1bacd81f2a8a9c67abee7a1a"
keyboardevents-areequal@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/keyboardevents-areequal/-/keyboardevents-areequal-0.2.1.tgz#4431d04fecc44f364cda73cf3f3270e177a54b8c"
klaw@^1.0.0:
version "1.3.1"
resolved "https://registry.yarnpkg.com/klaw/-/klaw-1.3.1.tgz#4088433b46b3b1ba259d78785d8e96f73ba02439"
@ -856,6 +905,18 @@ load-json-file@^1.0.0:
pinkie-promise "^2.0.0"
strip-bom "^2.0.0"
lodash.clonedeep@^4.5.0:
version "4.5.0"
resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
lodash.flattendeep@^4.4.0:
version "4.4.0"
resolved "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz#fb030917f86a3134e5bc9bec0d69e0013ddfedb2"
lodash.merge@^4.6.0:
version "4.6.0"
resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.0.tgz#69884ba144ac33fe699737a6086deffadd0f89c5"
loud-rejection@^1.0.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/loud-rejection/-/loud-rejection-1.6.0.tgz#5b46f80147edee578870f086d04821cf998e551f"
@ -875,6 +936,16 @@ map-obj@^1.0.0, map-obj@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
md5-hex@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/md5-hex/-/md5-hex-2.0.0.tgz#d0588e9f1c74954492ecd24ac0ac6ce997d92e33"
dependencies:
md5-o-matic "^0.1.1"
md5-o-matic@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/md5-o-matic/-/md5-o-matic-0.1.1.tgz#822bccd65e117c514fab176b25945d54100a03c3"
meow@^3.1.0:
version "3.7.0"
resolved "https://registry.yarnpkg.com/meow/-/meow-3.7.0.tgz#72cb668b425228290abbfa856892587308a801fb"
@ -930,6 +1001,10 @@ mkdirp@^0.5.0, mkdirp@^0.5.1:
dependencies:
minimist "0.0.8"
moment@^2.18.1:
version "2.18.1"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f"
ms@0.7.1:
version "0.7.1"
resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098"
@ -1502,6 +1577,10 @@ verror@1.3.6:
dependencies:
extsprintf "1.0.2"
well-known-symbols@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/well-known-symbols/-/well-known-symbols-1.0.0.tgz#73c78ae81a7726a8fa598e2880801c8b16225518"
which-module@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"