update changelog test #1994

Closed
Ricardojc2017 wants to merge 96 commits from master into 25-patch-file-view
143 changed files with 2183 additions and 2136 deletions

View file

@ -39,6 +39,7 @@
"no-return-assign": 0,
"react/require-default-props": 0,
"react/jsx-closing-tag-location": 0,
"jsx-a11y/no-noninteractive-element-to-interactive-role": 0
"jsx-a11y/no-noninteractive-element-to-interactive-role": 0,
"class-methods-use-this": 0
}
}

View file

@ -17,10 +17,10 @@ module.name_mapper='^types\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/types\1'
module.name_mapper='^component\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/component\1'
module.name_mapper='^page\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/page\1'
module.name_mapper='^lbry\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/lbry\1'
module.name_mapper='^rewards\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/rewards\1'
module.name_mapper='^modal\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/modal\1'
module.name_mapper='^app\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/app\1'
module.name_mapper='^native\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/native\1'
module.name_mapper='^analytics\(.*\)$' -> '<PROJECT_ROOT>/src/renderer/analytics\1'
[strict]

1
.gitignore vendored
View file

@ -1,3 +1,4 @@
.DS_Store
/node_modules
/dist
/static/daemon/lbrynet*

View file

@ -4,19 +4,20 @@ matrix:
env: TARGET=mac
osx_image: xcode9.2
language: node_js
node_js: "9"
node_js: '9'
- os: linux
env: TARGET=windows
services: docker
language: node_js
node_js: "9"
node_js: '9'
- os: linux
env: TARGET=linux
language: node_js
node_js: "9"
node_js: '9'
cache: false
before_install:
- |
- |
unset TRAVIS_COMMIT_MESSAGE;
if [ "$TRAVIS_OS_NAME" == "osx" ]; then
mkdir -p /tmp/git-lfs && curl -L https://github.com/github/git-lfs/releases/download/v2.3.1/git-lfs-$([ "$TRAVIS_OS_NAME" == "linux" ] && echo "linux" || echo "darwin")-amd64-2.3.1.tar.gz | tar -xz -C /tmp/git-lfs --strip-components 1
export PATH="/tmp/git-lfs:$PATH"
@ -28,22 +29,48 @@ before_install:
export PATH="$HOME/.yarn/bin:$PATH"
fi
before_script:
- git lfs pull
- git lfs pull
script:
- |
- |
if [ "$TARGET" == "windows" ]; then
docker run --rm \
--env-file <(env | grep -iE 'DEBUG|TARGET|NODE_|ELECTRON_|YARN_|NPM_|CI|CIRCLE|TRAVIS|APPVEYOR_|CSC_|GH_|GITHUB_|BT_|AWS_|STRIP|BUILD_') \
# Remove any special characters before adding to our list of ENVs
# https://github.com/electron-userland/electron-builder/issues/2450#issuecomment-421788155
ENVS=`env | grep -iE '(DEBUG|NODE_|ELECTRON_|YARN_|NPM_|CI|CIRCLE|TRAVIS|APPVEYOR_|CSC_|_TOKEN|_KEY|AWS_|STRIP|BUILD_|TARGET)([A-Z]|_)*=' | sed -n '/^[^\t]/s/=.*//p' | sed '/^$/d' | sed 's/^/-e /g' | tr '\n' ' '`
docker run $ENVS --rm \
-v ${PWD}:/project \
electronuserland/builder:wine \
/bin/bash -c "yarn --link-duplicates --pure-lockfile && yarn build --win --publish onTag";
/bin/bash -c "env | grep -v '\r' | grep -iE 'DEBUG|TARGET|NODE_|ELECTRON_|YARN_|NPM_|CI|CIRCLE|TRAVIS|APPVEYOR_|CSC_|GH_|GITHUB_|BT_|AWS_|STRIP|BUILD_|WIN_' && yarn --link-duplicates --pure-lockfile && yarn build --win --publish onTag";
fi
- if [ "$TARGET" == "mac" ]; then yarn build --publish onTag; fi
- if [ "$TARGET" == "linux" ]; then yarn --link-duplicates --pure-lockfile && yarn build --linux --publish onTag; fi
- if [ "$TARGET" == "mac" ]; then yarn build --publish onTag; fi
- if [ "$TARGET" == "linux" ]; then yarn --link-duplicates --pure-lockfile && yarn
build --linux --publish onTag; fi
addons:
artifacts:
working_dir: dist
paths:
- $(git ls-files -o dist/{*.dmg,*.exe,*.deb} | tr "\n" ":")
target_paths:
- /app/build-${TRAVIS_BUILD_NUMBER}_commit-${TRAVIS_COMMIT:0:7}$([ ! -z ${TRAVIS_TAG} ] && echo _tag-${TRAVIS_TAG})
- "/app/build-${TRAVIS_BUILD_NUMBER}_commit-${TRAVIS_COMMIT:0:7}$([ ! -z ${TRAVIS_TAG}
] && echo _tag-${TRAVIS_TAG})"
env:
global:
- ARTIFACTS_REGION=us-east-1
- ARTIFACTS_BUCKET=build.lbry.io
- DANGER_GITHUB_API_TOKEN=f8b612049cbda985c251e18ae36c7a2b9c6c92df
- ARTIFACTS_DEBUG=1
- WIN_CSC_LINK=https://s3.amazonaws.com/files.lbry.io/cert/win-csc-2018-2019-08.p12
- CSC_LINK=https://s3.amazonaws.com/files.lbry.io/cert/osx-cert.p12
#AWS_SECRET_ACCESS_KEY
- secure: aF0dZ1ub0r6X5SaTH7YYRpV8cl2gkU2tA7y2tkvGZQL0+Vv2FvkhwaXREa9IM9djm7r3W7I8vEekk6Skn300kIBwQ04COxgu+Oeqjsc2a529wmF9AN5EwKExKkVQFIjMjpMBmd/fE05PD29C0vULdtIMX8uhDe5zFE+tGD1QmwKVZ+55oCxJmt7vsQwQr46s/BsPODrZhvSUPWTUG4HSsc5DJwe/XYY+35vWQsnpCkBVabAZg+lnOpqLioRNzTsBX1oSkqTX9uvOC6fN+NlpbJWetzXsBciFcMHQCx9UHxu+Ibn3W3V8FVYRuFLAinhIg+JoVQHU8mH60ggjizATpgx12riP9e/Uwho5x5bgIYmnIBf4AHqupPv40iC/THMvsS08hCQHicu+/WiAvvN8wNQ1sqpj0+RTreB+4/qdRdwTs70t4jNV83cP+nAuekMCC7uYQ08GLmFNaa+x8NgDZa3JQv7EmXU0ALWVPeJ9UEV+dhEs5iI+7bLEhTUOuvBBWo17F4pst3pfS1j7md1x4wKFRWyP7IFmjK+L1KiAH94c/LIz2Nlp5yCDfbcwU5W/wCHYAxu5c8qnAlkxeub0GpxtZ66j6oOehk1lsHYxaZcBxyn7XhM1A6Mjxgy9OG0WGyYun8iH3aa4WcY0BO21l7je75s7l0qNSRS80st8kUE=
#AWS_ACCESS_KEY_ID
- secure: HHlUGaEjk0qsW9qb/93jdFhJypiDuJ0e6Z4UClW3ciMfdZ22Ur4D0oL0mgVguigTjdkf1Yy4Z1kWtWvtvQ8DBI+mdOl5GTMpX5nMattcuK/4gFXmqz30S3c07IPkilGKkAT64JqRGT7AvQTaV/tXqNNN9BbWCTAJSnhfzYJFvZQjnSmAAQvbqzMWEEein53244fWbDio462T7vzfbEHJD1pVUSrAMrKDgFSrIKJf4GQHceUk+fqWBjAsWN8USboo88JSLXn5qhD3ZczsgtZ2gi2KTvdfrHfZ5SpOzwc2AGr8U1laQzzW8c8xsPJPmM/3dCri/clcXassa4t/+2INYTPhKbmaD9hvjFRRMpoNjMCmPRJOmojxit8tqzCrw4nSGdr3/Bt0JjpLq90mfyL83YYU4gJXF97KzTl0lCy/DFXjBiHA9riRJVaXn3CI6L0i1RLCJI+C/rT9ErFB767t0aQtXlIWSZQ+IqWaoUdp57t0e2EtbRcjK7IYIXLNgZSbR0bY/TS005D/xZkexCpAtcV9F6iqDYP3HbGyiQqC75se0MqpNrZAx1a7WsSnumOcmtuU6LRriwjM0GXEACfGLCp4w4LBzKPwrOOg4QOhewHKgxpUff8KMlfTZ+Z8B7NBNjKSPbxiMedmpsiWpPRy6VeyvwNz32PUpjdsF3tIYMk=
#GH_TOKEN
- secure: g0gSiOmCKFzxLFV//oogmex+MkumCcGJ8CtvLzojAw1qhI1P6dGRH06yuCgBNW4PQGbbrYR2tntGEeq66LZ1bU7BJ2bdkv5lBi15JPH4POpA3OSc88YebitKIyIBI2WHA3VNCkF1JEFvrfTUX+4PjP+9h6vZ9tdfzezNTpc70SrGkWMhaoe+F8u6jCL63VBpnncf0foz3WlqUFNoIdinQLYxI6S2QmHz1p1HToC+MOosBgWDufX2+6B/Efq7JDFZgx/zItFzR1OCafKx8rScUd4woAqK+8mt862IzzEbztTv6IPSdhx/hsbO7rHMcjDFk/MuDeC9TaaXqMvvKmLuvWKH+dy4BvIiJJ/WuDfzumrw+8BvTbcnXFXkEXTlkQnZD0otBZsmI4/OPH5vIGUmVIwBFXjPBcNq/Xwig8hRCxrdioEZPO4C17fMCdOn3gAx+GcMddfAIKnrlG/XK2jL8kCylL7++OEkedzYiHWA7p9eaJDjxYmIxKcfYTyF4VIMYS/wAC5W1zi1AjM5BiUhBGp/Vd+f3UUTOsqWOmS4A8cqhK/rbx4xgdwUuv2DoljeQtWd2xdZFr10L2ErmEIdfdtZBVyauaGOhhXUqpSAB5PAwSRNNWkZFCJXmqMHemih4jlfN/KS+rujh5dbyXz81BPjyxrDAziO4Q19rz7hmVI=
#ARTIFACTS_KEY
- secure: giJRkODdgvMpaLh58c3UKTy6j3IjUVQ2wVvLmECN8caVLuBnEp3U56rUT7sQPzeMoaF9goOLKXD1o+qKdGsLz2Dedi/3vFr3IXTgpYwO03eMkylYUDUwKXV1Fv14ME+wknw/Fshmty1XAc/RwlTaCks9usIRT9OE75HvV8ILVfLdSwwRR/TKFEdEDjAY/3ROVFsleDKBIe1AG/AHeN37Mwqfo39zpN5Zidm3HUegujsMsHtPQtUUCvCxiaiBtqIz79WQuiXjelLWrV53k+ulpptz4T6M8FO5jxBCL5HQMbYy4J8BhukAPHUcTVzarsDe1XEmP6xtClcAydMiHmzUBh9VbvRF8AKwGGO41g6OasgMaJ/eUlACGWTIS2AsqgkXCEgWRtswwI4edLgT/F74fKxGV82zRYLcmjWceGc9H6m2YfIIQZ2PNsDloFgTWa63oZ1sT20fWmNohD3IgVK21rjrCnMbp5/RfBdihR1+GsS8wMA15nhUW3SHfSHKV0009FZdDjxgmigjjmFt1/SM8YGZDijQc7DoUsrScR9n2JR+KVqEED3BYOviw0M0blb6b2dqK0A3+N5C1RGt8Uu8AAuAzdPDviL38m4n1UOdI1Tij1boSfr1USvfipPfQXrqSWHIY3RITMmjPREmcdj2dbhjoUEFaFfp/b3sJxUI3I4=
#ARTIFACTS_SECRET
- secure: RtPES82DBisaCkernDm10u8mzNc8K4EyyTJUCopcFFJHfFpleuJOoXNFZGXixjHXWTxqc5+IjLThBZFG6krTpD4ocftfkBNeVDXL91JsGRW6X4VBpKaJp1UJZZiYjpPZRJDwVuIb570WcX3xXmsvAwwdODkeXgBZoOw+LZIz4HV3OACi5iaWCx4+2WvQiaz/6mRkLlw9iY1m9gCGQXXUSWyY+bGWsOdGWpfp/VfzpX7mBJbcIYjvRYSnBtVUFkEzxHlaR/CFc7Jio45EUImhBKqKV8QGAiv9AowcWqQn8y2SuW8J66bkaZGbGpyEdsRQDJKUU5naRIFJ/002e4XjI2moBfSHHnFTMH/AawA4b+gCjein8jDiRugJw8AqC4KpG660SFJwC4A8IxfPcXWcykahrL6kJhs+NFbyxQEJIMUqP6UAAiPAuUr/Whq1F8x5b39pEibRZ3Vv0Bix/lUj4cWZYRBL1ckoUgSCeG7llkAdnxLuQKfDvTw+HFcWGq7yg/ye7H7CwpBJkSSOlnQ61nuucC82hVqBGoPGbFW3vjS0BqesLcaO7kwW/fdBnIxwLiWWHDWol0aLfQLEzjUzpS+tA1YYKvrG+yNMEeYtHEK9ZcltQD52uEtjK26DIY8tQU8PxMlXha6/XTOlt8MIcl8IPULmVWKT9k8LPTFQiXc=
#CSC_KEY_PASSWORD
- secure: TDKeF7/WGwR+di+JhNp29x7NPzVMO/q+72n58zB5goI1NUKaeKgjeWbfVYx9f+4G9a9/pdDVUfORt8i6OW8ZhhqYS4E8G5F56q+oX3nrjNqM8NqoK09ehZS/wdYGbenG9oTfXYenDdwusZV4Fq0BRRLjqAIXPQCKg3//MKseh/1fHDGVGXpYUimHRSCkwspbbfB/9Qw9KEBjweeXiAwB+5F+E7fPlVtqsIvtkkED1hKe0Z8HdECC6JTZ0ZHPDDFGV3aondXQDgUlfchnZ6HDdNDO5y/hPEj0laiZQ7BssenJ8Z7qjHc5O9AKXfG+6WFICHvtgjQ0+x6rk6gpvJcyI1x2+Kck/s0EcSkFY+Yz81BxdehIeKPn9U8LpGaFbtxsp01661yeaIpAqT/PqFsdj/kFXFT6gwZlGGPMBm2WgQR4A61qkOO1jokqz/z6CnY+MNeE8E1Fh4bFoZ0JwUJFJugoyDahHpVlLw5lZaSipJO6RZ1xjoZ3XGmxvtkM4dQ16xQ++Q8EgD878uCWn2jZ5YTQdKANfXYTKSiQfoEjLeX0T6I6GSdim4ZURjcolmGNMH/3jhISOXj+e2UkLc6jwO4Ek084o6ciJ2JjqEhXvXOCeRJ2I9cf2dEk7CvtbitiDly6XATo2FP4hqNdcNNWyj/jFvuTwFT6hzBqLk1BCBc=
#WIN_CSC_KEY_PASSWORD
- secure: LBwkNMw5paoxpeLcNvAbrSLghLH0kXmgctBkUK6hgqJ/6WReWKlERUCwWQp/NcAB5Nb8fUTV8hXz1UjeQG1HH65geRcxya9sf9xu446e2gRdYGfYk7AhZdIw97IlwTYv2tpnjejiVXIoClQjKRYtOkRC4BIGW+Ydun1hwEUXTVMCplOzPhpLrkJCIDDDdM4eJjWm6ZMshCKRlnt42sNdx63FHBAH72rqBnt2jd+ISIadASnWz0nQlN5aIvXR6cLZfSl8Qt/JDL+LXzWX+pNA4BegCtW3hBoLrW18QdNPxrvPCvKjRCC3LHuv+KEGbzGv/QkXg5f9BKZehIZ/hjYgxysjeHBI8yOfCoyrDafxSIso5ja2TtL9lLpW90gbkbtEFiaL2XOMUbQcwWQ6RShSoLZxgiAl6zUmrq3UtS30OjnjWgMj+WnU2BcgpmpPzU0Hz/fblX6/EnwXhPNRYZvm5JyhVRYLZypLWuV4XsWGuLbUOOrsYi7UvU+xo+3AaxbUW4A6XuQ/DUh0ZVNlpPGcVi7A2tx4/46Wm0oLwQ5NYVukHbEiHWZ4HuKqSionwtgG0T2a6/7JQdH7gb+/86z4YHmK89dd/aE84hBUGTB/pNvvtDBYBE3c60SzL0CFPJZrbz9E0gVhLfsHO+5/VCFIipgM8mYoVzsq+cONKbqUPCg=

View file

@ -5,6 +5,28 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/).
## [Unreleased]
### Added
* Allow typing of encryption password without clicking entry box ([#1977](https://github.com/lbryio/lbry-desktop/pull/1977))
### Changed
* Make tooltip smarter ([#1979](https://github.com/lbryio/lbry-desktop/pull/1979))
### Fixed
* Invite table cutoff with large number of invites ([#1985](https://github.com/lbryio/lbry-desktop/pull/1985))
## [0.25.1] - 2018-09-18
### Fixed
* Paragraph rendering now properly includes a margin for new paragraphs ([#1939](https://github.com/lbryio/lbry-desktop/pull/1939))
* Alignment of "navigate to page" input next to pagination on channel pages ([#1941](https://github.com/lbryio/lbry-desktop/pull/1941))
* Table spacing with claim name in transactions table ([#1942](https://github.com/lbryio/lbry-desktop/pull/1942))
* Ability to click away from tip screen without the cancel button ([#1944](https://github.com/lbryio/lbry-desktop/pull/1944))
* Disallow invalid tip amounts ([#1947](https://github.com/lbryio/lbry-desktop/pull/1947))
* Ensure we record views for downloaded content from subscriptions and autoplay ([#1962](https://github.com/lbryio/lbry-desktop/pull/1962))
## [0.25.0] - 2018-08-29
### Added
* Wallet encryption/decryption user flows in settings ([#1785](https://github.com/lbryio/lbry-desktop/pull/1785))
* Suggestions for recommended content on file page ([#1845](https://github.com/lbryio/lbry-desktop/pull/1845))
@ -18,14 +40,15 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/).
* Desktop notification when publish is completed ([#1892](https://github.com/lbryio/lbry-desktop/pull/1892))
* FAQ to Publishing Area ([#1833](https://github.com/lbryio/lbry-desktop/pull/1833))
* FAQ to wallet security area ([#1917](https://github.com/lbryio/lbry-desktop/pull/1917))
### Changed
* Upgraded LBRY Protocol to [version 0.21.2](https://github.com/lbryio/lbry/releases/tag/v0.21.2) fixing a download bug.
* Searching now shows results by default, including direct lbry:// URL tile
* Searching now shows results by default, including direct lbry:// URL tile ([#1875](https://github.com/lbryio/lbry-desktop/pull/))
* Replaced checkboxes with toggles throughout app ([#1834](https://github.com/lbryio/lbry-desktop/pull/1834))
* Removed price tile when content is Free ([#1845](https://github.com/lbryio/lbry-desktop/pull/1845))
* Pass error message from spee.ch API during thumbnail upload ([#1840](https://github.com/lbryio/lbry-desktop/pull/1840))
* Use router pattern for rendering file viewer ([#1544](https://github.com/lbryio/lbry-desktop/pull/1544))
* Missing word "to" added to the Bid Help Text (#1854)
* Missing word "to" added to the Bid Help Text ([#1854](https://github.com/lbryio/lbry-desktop/pull/1854))
* Updated to electron@2 ([#1858](https://github.com/lbryio/lbry-desktop/pull/1858))
### Fixed

View file

@ -1,6 +1,6 @@
{
"name": "LBRY",
"version": "0.25.0",
"version": "0.25.1",
"description": "A browser for the LBRY network, a digital marketplace controlled by its users.",
"keywords": [
"lbry"
@ -30,7 +30,7 @@
"flow-defs": "flow-typed install",
"release": "yarn compile && electron-builder build",
"precommit": "lint-staged",
"preinstall": "yarn cache clean lbry-redux",
"preinstall": "yarn cache clean lbry-redux && yarn cache clean lbryinc",
"postinstall": "electron-builder install-app-deps && node build/downloadDaemon.js"
},
"dependencies": {
@ -50,7 +50,8 @@
"formik": "^0.10.4",
"hast-util-sanitize": "^1.1.2",
"keytar": "^4.2.1",
"lbry-redux": "lbryio/lbry-redux#421321a78397251589e5a890f4caa95e79975e2b",
"lbry-redux": "lbryio/lbry-redux#c079b108c3bc4ba2b4fb85fb112b52cfc040c301",
"lbryinc": "lbryio/lbryinc#de7ff055605b02a24821f0f9bab1d206eb7f235d",
"localforage": "^1.7.1",
"mammoth": "^1.4.6",
"mime": "^2.3.1",

View file

@ -1,6 +1,6 @@
// @flow
import mixpanel from 'mixpanel-browser';
import Lbryio from 'lbryio';
import { Lbryio } from 'lbryinc';
import isDev from 'electron-is-dev';
if (isDev) {

View file

@ -38,4 +38,7 @@ global.__ = i18n.__;
global.__n = i18n.__n;
global.app = app;
// Lbryinc needs access to the redux store for dispatching auth-releated actions
global.store = app.store;
export default app;

View file

@ -4,9 +4,14 @@ import { clipboard } from 'electron';
import { FormRow } from 'component/common/form';
import Button from 'component/button';
import * as icons from 'constants/icons';
/*
noSnackbar added due to issue 1945
https://github.com/lbryio/lbry-desktop/issues/1945
"Snackbars and modals can't be displayed at the same time"
*/
type Props = {
address: string,
noSnackbar: boolean,
doNotify: ({ message: string, displayType: Array<string> }) => void,
};
@ -20,7 +25,7 @@ export default class Address extends React.PureComponent<Props> {
input: ?HTMLInputElement;
render() {
const { address, doNotify } = this.props;
const { address, doNotify, noSnackbar } = this.props;
return (
<FormRow verticallyCentered padded stretch>
@ -43,10 +48,12 @@ export default class Address extends React.PureComponent<Props> {
icon={icons.CLIPBOARD}
onClick={() => {
clipboard.writeText(address);
if (!noSnackbar) {
doNotify({
message: __('Address copied'),
displayType: ['snackbar'],
});
}
}}
/>
</FormRow>

View file

@ -1,7 +1,7 @@
import { connect } from 'react-redux';
import { selectPageTitle, selectHistoryIndex, selectActiveHistoryEntry } from 'lbry-redux';
import { doRecordScroll } from 'redux/actions/navigation';
import { selectUser } from 'redux/selectors/user';
import { selectUser } from 'lbryinc';
import { doAlertError } from 'redux/actions/app';
import App from './view';
@ -17,4 +17,7 @@ const perform = dispatch => ({
recordScroll: scrollPosition => dispatch(doRecordScroll(scrollPosition)),
});
export default connect(select, perform)(App);
export default connect(
select,
perform
)(App);

View file

@ -1,12 +1,14 @@
import React from 'react';
import { connect } from 'react-redux';
import { selectUserEmail } from 'redux/selectors/user';
import { selectUserEmail } from 'lbryinc';
import CardVerify from './view';
const select = state => ({
email: selectUserEmail(state),
});
const perform = dispatch => ({});
const perform = () => ({});
export default connect(select, perform)(CardVerify);
export default connect(
select,
perform
)(CardVerify);

View file

@ -79,7 +79,7 @@ class ChannelTile extends React.PureComponent<Props> {
'card__title--large': size === 'large',
})}
>
<TruncatedText lines={1}>{channelName || uri}</TruncatedText>
<TruncatedText text={channelName || uri} lines={1} />
</div>
<div
className={classnames('card__subtitle', {

View file

@ -24,9 +24,27 @@ type Props = {
stretch?: boolean,
affixClass?: string, // class applied to prefix/postfix label
firstInList?: boolean, // at the top of a list, no padding top
autoFocus?: boolean,
inputProps: {
disabled?: boolean,
},
};
export class FormField extends React.PureComponent<Props> {
constructor(props) {
super(props);
this.input = React.createRef();
}
componentDidMount() {
const { autoFocus } = this.props;
const input = this.input.current;
if (input && autoFocus) {
input.focus();
}
}
render() {
const {
render,
@ -40,6 +58,7 @@ export class FormField extends React.PureComponent<Props> {
children,
stretch,
affixClass,
autoFocus,
...inputProps
} = this.props;
@ -79,7 +98,7 @@ export class FormField extends React.PureComponent<Props> {
} else if (type === 'checkbox') {
input = <Toggle id={name} {...inputProps} />;
} else {
input = <input type={type} id={name} {...inputProps} />;
input = <input type={type} id={name} {...inputProps} ref={this.input} />;
}
}

View file

@ -9,6 +9,7 @@ type Props = {
verticallyCentered?: boolean,
stretch?: boolean,
alignRight?: boolean,
centered?: boolean,
};
export class FormRow extends React.PureComponent<Props> {
@ -17,7 +18,7 @@ export class FormRow extends React.PureComponent<Props> {
};
render() {
const { children, padded, verticallyCentered, stretch, alignRight } = this.props;
const { children, padded, verticallyCentered, stretch, alignRight, centered } = this.props;
return (
<div
className={classnames('form-row', {
@ -25,6 +26,7 @@ export class FormRow extends React.PureComponent<Props> {
'form-row--vertically-centered': verticallyCentered,
'form-row--stretch': stretch,
'form-row--right': alignRight,
'form-row--centered': centered,
})}
>
{children}

View file

@ -8,6 +8,7 @@ import Tooltip from 'component/common/tooltip';
// These are copied from `scss/vars`, can they both come from the same source?
const RED_COLOR = '#e2495e';
const GREEN_COLOR = '#44b098';
const BLUE_COLOR = '#49b2e2';
type Props = {
icon: string,
@ -33,6 +34,8 @@ class IconComponent extends React.PureComponent<Props> {
return RED_COLOR;
case 'green':
return GREEN_COLOR;
case 'blue':
return BLUE_COLOR;
default:
return undefined;
}

View file

@ -16,8 +16,67 @@ class ToolTip extends React.PureComponent<Props> {
direction: 'bottom',
};
constructor(props) {
super(props);
this.tooltip = React.createRef();
this.state = {
direction: this.props.direction,
};
}
componentDidMount() {
this.handleVisibility();
}
getVisibility = () => {
const node = this.tooltip.current;
const rect = node.getBoundingClientRect();
// Get parent-container
const viewport = document.getElementById('content');
const visibility = {
top: rect.top >= 0,
left: rect.left >= 0,
right: rect.right <= viewport.offsetWidth,
bottom: rect.bottom <= viewport.offsetHeight,
};
return visibility;
};
invertDirection = () => {
// Get current direction
const { direction } = this.state;
// Inverted directions
const directions = {
top: 'bottom',
left: 'right',
right: 'left',
bottom: 'top',
};
const inverted = directions[direction];
// Update direction
if (inverted) {
this.setState({ direction: inverted });
}
};
handleVisibility = () => {
const { direction } = this.state;
const visibility = this.getVisibility();
// Invert direction if tooltip is outside viewport bounds
if (!visibility[direction]) {
this.invertDirection();
}
};
render() {
const { children, label, body, icon, direction, onComponent } = this.props;
const { direction } = this.state;
const { children, label, body, icon, onComponent } = this.props;
const tooltipContent = children || label;
const bodyLength = body.length;
@ -25,6 +84,8 @@ class ToolTip extends React.PureComponent<Props> {
return (
<span
onFocus={this.handleVisibility}
onMouseOver={this.handleVisibility}
className={classnames('tooltip', {
'tooltip--label': label && !icon,
'tooltip--icon': icon,
@ -37,6 +98,7 @@ class ToolTip extends React.PureComponent<Props> {
>
{tooltipContent}
<span
ref={this.tooltip}
className={classnames('tooltip__body', {
'tooltip__body--short': isShortDescription,
})}

View file

@ -2,13 +2,13 @@
import * as React from 'react';
type Props = {
lines: ?number,
children: React.Node,
text: string,
lines: number,
};
const TruncatedText = (props: Props) => (
<span className="truncated-text" style={{ WebkitLineClamp: props.lines }}>
{props.children}
<span title={props.text} className="truncated-text" style={{ WebkitLineClamp: props.lines }}>
{props.text}
</span>
);

View file

@ -8,7 +8,10 @@ import {
makeSelectClaimIsMine,
} from 'lbry-redux';
import { doNavigate } from 'redux/actions/navigation';
import { selectRewardContentClaimIds } from 'redux/selectors/content';
import {
selectRewardContentClaimIds,
makeSelectContentPositionForUri,
} from 'redux/selectors/content';
import { selectShowNsfw } from 'redux/selectors/settings';
import { selectPendingPublish } from 'redux/selectors/publish';
import FileCard from './view';
@ -32,12 +35,14 @@ const select = (state, props) => {
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
...fileCardInfo,
pending: !!pendingPublish,
position: makeSelectContentPositionForUri(props.uri)(state),
};
};
const perform = dispatch => ({
navigate: (path, params) => dispatch(doNavigate(path, params)),
resolveUri: uri => dispatch(doResolveUri(uri)),
clearHistoryUri: uri => dispatch(doClearContentHistoryUri(uri)),
});
export default connect(

View file

@ -5,13 +5,12 @@ import type { Claim, Metadata } from 'types/claim';
import CardMedia from 'component/cardMedia';
import TruncatedText from 'component/common/truncated-text';
import Icon from 'component/common/icon';
import FilePrice from 'component/filePrice';
import UriIndicator from 'component/uriIndicator';
import * as icons from 'constants/icons';
import classnames from 'classnames';
import { openCopyLinkMenu } from '../../util/contextMenu';
import FilePrice from 'component/filePrice';
import { openCopyLinkMenu } from 'util/contextMenu';
// TODO: iron these out
type Props = {
uri: string,
claim: ?Claim,
@ -21,11 +20,11 @@ type Props = {
rewardedContentClaimIds: Array<string>,
obscureNsfw: boolean,
claimIsMine: boolean,
showPrice: boolean,
pending?: boolean,
/* eslint-disable react/no-unused-prop-types */
resolveUri: string => void,
isResolvingUri: boolean,
showPrice: boolean,
/* eslint-enable react/no-unused-prop-types */
};
@ -59,8 +58,8 @@ class FileCard extends React.PureComponent<Props> {
rewardedContentClaimIds,
obscureNsfw,
claimIsMine,
showPrice,
pending,
showPrice,
} = this.props;
const shouldHide = !claimIsMine && !pending && obscureNsfw && metadata && metadata.nsfw;
@ -94,7 +93,7 @@ class FileCard extends React.PureComponent<Props> {
<CardMedia thumbnail={thumbnail} />
<div className="card__title-identity">
<div className="card__title--small card__title--file-card">
<TruncatedText lines={2}>{title}</TruncatedText>
<TruncatedText text={title} lines={2} />
</div>
<div className="card__subtitle">
{pending ? <div>Pending...</div> : <UriIndicator uri={uri} link />}

View file

@ -7,8 +7,7 @@ import {
makeSelectClaimForUri,
} from 'lbry-redux';
import { doOpenFileInShell } from 'redux/actions/file';
import { doPurchaseUri, doStartDownload } from 'redux/actions/content';
import { doPause } from 'redux/actions/media';
import { doPurchaseUri, doStartDownload, doSetPlayingUri } from 'redux/actions/content';
import FileDownloadLink from './view';
const select = (state, props) => ({
@ -24,7 +23,7 @@ const perform = dispatch => ({
openInShell: path => dispatch(doOpenFileInShell(path)),
purchaseUri: uri => dispatch(doPurchaseUri(uri)),
restartDownload: (uri, outpoint) => dispatch(doStartDownload(uri, outpoint)),
doPause: () => dispatch(doPause()),
pause: () => dispatch(doSetPlayingUri(null)),
});
export default connect(

View file

@ -22,7 +22,7 @@ type Props = {
restartDownload: (string, number) => void,
openInShell: string => void,
purchaseUri: string => void,
doPause: () => void,
pause: () => void,
};
class FileDownloadLink extends React.PureComponent<Props> {
@ -50,14 +50,14 @@ class FileDownloadLink extends React.PureComponent<Props> {
purchaseUri,
costInfo,
loading,
doPause,
pause,
claim,
} = this.props;
const openFile = () => {
if (fileInfo) {
openInShell(fileInfo.download_path);
doPause();
pause();
}
};

View file

@ -145,7 +145,8 @@ class FileList extends React.PureComponent<Props, State> {
name: claimName,
claim_name: claimNameDownloaded,
claim_id: claimId,
outpoint,
txid,
nout,
} = fileInfo;
const uriParams = {};
@ -155,6 +156,7 @@ class FileList extends React.PureComponent<Props, State> {
uriParams.contentName = name;
uriParams.claimId = claimId;
const uri = buildURI(uriParams);
const outpoint = `${txid}:${nout}`;
// See https://github.com/lbryio/lbry-desktop/issues/1327 for discussion around using outpoint as the key
content.push(<FileCard key={outpoint} uri={uri} checkPending={checkPending} />);

View file

@ -127,7 +127,7 @@ class FileTile extends React.PureComponent<Props> {
'card__title--large': size === 'large',
})}
>
<TruncatedText lines={size === 'small' ? 2 : 3}>{title || name}</TruncatedText>
<TruncatedText text={title || name} lines={size === 'small' ? 2 : 3} />
</div>
<div
className={classnames('card__subtitle', {
@ -151,7 +151,7 @@ class FileTile extends React.PureComponent<Props> {
'card__subtext--large': size === 'large',
})}
>
<TruncatedText lines={size === 'large' ? 4 : 3}>{description}</TruncatedText>
<TruncatedText text={description} lines={size === 'large' ? 4 : 3} />
</div>
)}
{!name && (

View file

@ -2,9 +2,8 @@ import { connect } from 'react-redux';
import * as settings from 'constants/settings';
import { doChangeVolume } from 'redux/actions/app';
import { selectVolume } from 'redux/selectors/app';
import { doPlayUri, doSetPlayingUri } from 'redux/actions/content';
import { doPlay, doPause, savePosition } from 'redux/actions/media';
import { doClaimEligiblePurchaseRewards } from 'redux/actions/rewards';
import { doPlayUri, doSetPlayingUri, savePosition } from 'redux/actions/content';
import { doClaimEligiblePurchaseRewards } from 'lbryinc';
import {
makeSelectMetadataForUri,
makeSelectContentTypeForUri,
@ -16,8 +15,7 @@ import {
selectSearchBarFocused,
} from 'lbry-redux';
import { makeSelectClientSetting, selectShowNsfw } from 'redux/selectors/settings';
import { selectMediaPaused, makeSelectMediaPositionForUri } from 'redux/selectors/media';
import { selectPlayingUri } from 'redux/selectors/content';
import { selectPlayingUri, makeSelectContentPositionForUri } from 'redux/selectors/content';
import { selectFileInfoErrors } from 'redux/selectors/file_info';
import FileViewer from './view';
@ -32,8 +30,7 @@ const select = (state, props) => ({
playingUri: selectPlayingUri(state),
contentType: makeSelectContentTypeForUri(props.uri)(state),
volume: selectVolume(state),
mediaPaused: selectMediaPaused(state),
mediaPosition: makeSelectMediaPositionForUri(props.uri)(state),
position: makeSelectContentPositionForUri(props.uri)(state),
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
searchBarFocused: selectSearchBarFocused(state),
fileInfoErrors: selectFileInfoErrors(state),
@ -43,10 +40,9 @@ const perform = dispatch => ({
play: uri => dispatch(doPlayUri(uri)),
cancelPlay: () => dispatch(doSetPlayingUri(null)),
changeVolume: volume => dispatch(doChangeVolume(volume)),
doPlay: () => dispatch(doPlay()),
doPause: () => dispatch(doPause()),
savePosition: (claimId, position) => dispatch(savePosition(claimId, position)),
claimRewards: () => dispatch(doClaimEligiblePurchaseRewards()),
savePosition: (claimId, outpoint, position) =>
dispatch(savePosition(claimId, outpoint, position)),
});
export default connect(

View file

@ -27,9 +27,11 @@ class MediaPlayer extends React.PureComponent {
this.toggleFullScreenVideo = this.toggleFullScreen.bind(this);
}
componentWillReceiveProps(nextProps) {
componentDidUpdate(nextProps) {
const el = this.refs.media.children[0];
if (!this.props.paused && nextProps.paused && !el.paused) el.pause();
if (this.props.playingUri && !nextProps.playingUri && !el.paused) {
el.pause();
}
}
componentDidMount() {
@ -86,11 +88,15 @@ class MediaPlayer extends React.PureComponent {
document.addEventListener('keydown', this.togglePlayListener);
const mediaElement = this.media.children[0];
if (mediaElement) {
mediaElement.currentTime = position || 0;
mediaElement.addEventListener('play', () => this.props.doPlay());
mediaElement.addEventListener('pause', () => this.props.doPause());
if (position) {
mediaElement.currentTime = position;
}
mediaElement.addEventListener('timeupdate', () =>
this.props.savePosition(claim.claim_id, mediaElement.currentTime)
this.props.savePosition(
claim.claim_id,
`${claim.txid}:${claim.nout}`,
mediaElement.currentTime
)
);
mediaElement.addEventListener('click', this.togglePlayListener);
mediaElement.addEventListener('loadedmetadata', loadedMetadata.bind(this), {
@ -136,7 +142,6 @@ class MediaPlayer extends React.PureComponent {
if (mediaElement) {
mediaElement.removeEventListener('click', this.togglePlayListener);
}
this.props.doPause();
}
toggleFullScreen(event) {

View file

@ -34,11 +34,8 @@ type Props = {
volume: number,
claim: Claim,
uri: string,
doPlay: () => void,
doPause: () => void,
savePosition: (string, number) => void,
mediaPaused: boolean,
mediaPosition: ?number,
savePosition: (string, string, number) => void,
position: ?number,
className: ?string,
obscureNsfw: boolean,
play: string => void,
@ -127,14 +124,14 @@ class FileViewer extends React.PureComponent<Props> {
}
handleAutoplay = (props: Props) => {
const { autoplay, playingUri, fileInfo, costInfo, isDownloading, uri, play, metadata } = props;
const { autoplay, playingUri, fileInfo, costInfo, isDownloading, uri, metadata } = props;
const playable = autoplay && playingUri !== uri && metadata && !metadata.nsfw;
if (playable && costInfo && costInfo.cost === 0 && !fileInfo && !isDownloading) {
play(uri);
this.playContent();
} else if (playable && fileInfo && fileInfo.blobs_completed > 0) {
play(uri);
this.playContent();
}
};
@ -202,11 +199,8 @@ class FileViewer extends React.PureComponent<Props> {
volume,
claim,
uri,
doPlay,
doPause,
savePosition,
mediaPaused,
mediaPosition,
position,
className,
obscureNsfw,
mediaType,
@ -251,14 +245,12 @@ class FileViewer extends React.PureComponent<Props> {
downloadCompleted={fileInfo.completed}
changeVolume={changeVolume}
volume={volume}
doPlay={doPlay}
doPause={doPause}
savePosition={savePosition}
claim={claim}
uri={uri}
paused={mediaPaused}
position={mediaPosition}
position={position}
startedPlayingCb={this.startedPlayingCb}
playingUri={playingUri}
/>
)}
</div>

View file

@ -1,6 +1,5 @@
import React from 'react';
import { connect } from 'react-redux';
import { selectUserInvitees, selectUserInviteStatusIsPending } from 'redux/selectors/user';
import { selectUserInvitees, selectUserInviteStatusIsPending } from 'lbryinc';
import InviteList from './view';
const select = state => ({
@ -8,6 +7,9 @@ const select = state => ({
isPending: selectUserInviteStatusIsPending(state),
});
const perform = dispatch => ({});
const perform = () => ({});
export default connect(select, perform)(InviteList);
export default connect(
select,
perform
)(InviteList);

View file

@ -1,10 +1,20 @@
// @flow
import React from 'react';
import Icon from 'component/common/icon';
import RewardLink from 'component/rewardLink';
import rewards from 'rewards.js';
import { rewards } from 'lbryinc';
import * as icons from 'constants/icons';
class InviteList extends React.PureComponent {
type Props = {
invitees: ?Array<{
email: string,
invite_accepted: boolean,
invite_reward_claimed: boolean,
invite_reward_claimable: boolean,
}>,
};
class InviteList extends React.PureComponent<Props> {
render() {
const { invitees } = this.props;
@ -31,8 +41,8 @@ class InviteList extends React.PureComponent {
</tr>
</thead>
<tbody>
{invitees.map((invitee, index) => (
<tr key={index}>
{invitees.map(invitee => (
<tr key={invitee.email}>
<td>{invitee.email}</td>
<td className="text-center">
{invitee.invite_accepted ? (

View file

@ -3,8 +3,8 @@ import {
selectUserInvitesRemaining,
selectUserInviteNewIsPending,
selectUserInviteNewErrorMessage,
} from 'redux/selectors/user';
import { doUserInviteNew } from 'redux/actions/user';
doUserInviteNew,
} from 'lbryinc';
import InviteNew from './view';
const select = state => ({
@ -17,4 +17,7 @@ const perform = dispatch => ({
inviteNew: email => dispatch(doUserInviteNew(email)),
});
export default connect(select, perform)(InviteNew);
export default connect(
select,
perform
)(InviteNew);

View file

@ -4,11 +4,10 @@ import {
selectPageTitle,
selectIsBackDisabled,
selectIsForwardDisabled,
selectNavLinks,
} from 'lbry-redux';
import { doNavigate, doHistoryBack, doHistoryForward } from 'redux/actions/navigation';
import { doDownloadUpgrade } from 'redux/actions/app';
import { selectIsUpgradeAvailable } from 'redux/selectors/app';
import { selectIsUpgradeAvailable, selectNavLinks } from 'redux/selectors/app';
import { formatCredits } from 'util/formatCredits';
import Page from './view';
@ -28,4 +27,7 @@ const perform = dispatch => ({
downloadUpgrade: () => dispatch(doDownloadUpgrade()),
});
export default connect(select, perform)(Page);
export default connect(
select,
perform
)(Page);

View file

@ -1,74 +1,38 @@
// @flow
import * as React from 'react';
import Button from 'component/button';
import { buildURI } from 'lbry-redux';
import type { Claim } from 'types/claim';
type Props = {
uri: ?string,
isResolvingUri: boolean,
winningBidForClaimUri: ?number,
myClaimForUri: ?Claim,
isStillEditing: boolean,
onEditMyClaim: (any, string) => void,
amountNeededForTakeover: ?number,
};
class BidHelpText extends React.PureComponent<Props> {
render() {
const {
uri,
isResolvingUri,
winningBidForClaimUri,
myClaimForUri,
onEditMyClaim,
isStillEditing,
} = this.props;
if (!uri) {
return __('Create a URL for this content.');
}
if (isStillEditing) {
return __(
'You are currently editing this claim. If you change the URL, you will need to reselect a file.'
);
}
const { uri, isResolvingUri, amountNeededForTakeover } = this.props;
let bidHelpText;
if (uri) {
if (isResolvingUri) {
return __('Checking the winning claim amount...');
bidHelpText = __('Checking the winning claim amount...');
} else if (!amountNeededForTakeover) {
bidHelpText = __('Any amount will give you the winning bid.');
} else {
bidHelpText = `${__('If you bid more than')} ${amountNeededForTakeover} LBC, ${__(
'when someone navigates to'
)} ${uri} ${__('it will load your published content')}. ${__(
'However, you can get a longer version of this URL for any bid'
)}.`;
}
}
if (myClaimForUri) {
const editUri = buildURI({
contentName: myClaimForUri.name,
claimId: myClaimForUri.claim_id,
});
return (
<React.Fragment>
{__('You already have a claim at')}
{` ${uri} `}
<Button
button="link"
label="Edit it"
onClick={() => onEditMyClaim(myClaimForUri, editUri)}
/>
<br />
{__('Publishing will update your existing claim.')}
{__('This LBC remains yours and the deposit can be undone at any time.')}
<div>{bidHelpText}</div>
</React.Fragment>
);
}
return winningBidForClaimUri ? (
<React.Fragment>
{__('A deposit greater than')} {winningBidForClaimUri} {__('is needed to win')}
{` ${uri}. `}
{__('However, you can still get this URL for any amount.')}
</React.Fragment>
) : (
__('Any amount will give you the winning bid.')
);
}
}
export default BidHelpText;

View file

@ -0,0 +1,49 @@
// @flow
import * as React from 'react';
import Button from 'component/button';
import { buildURI } from 'lbry-redux';
import type { Claim } from 'types/claim';
type Props = {
uri: ?string,
myClaimForUri: ?Claim,
isStillEditing: boolean,
onEditMyClaim: (any, string) => void,
};
class NameHelpText extends React.PureComponent<Props> {
render() {
const { uri, myClaimForUri, onEditMyClaim, isStillEditing } = this.props;
let nameHelpText;
if (isStillEditing) {
nameHelpText = __(
'You are currently editing this claim. If you change the URL, you will need to reselect a file.'
);
} else if (uri && myClaimForUri) {
const editUri = buildURI({
contentName: myClaimForUri.name,
claimId: myClaimForUri.claim_id,
});
nameHelpText = (
<React.Fragment>
{__('You already have a claim at')}
{` ${uri} `}
<Button
button="link"
label="Edit it"
onClick={() => onEditMyClaim(myClaimForUri, editUri)}
/>
<br />
{__('Publishing will update your existing claim.')}
</React.Fragment>
);
}
return <React.Fragment>{nameHelpText || __('Create a URL for this content.')}</React.Fragment>;
}
}
export default NameHelpText;

View file

@ -13,6 +13,7 @@ import { CHANNEL_NEW, CHANNEL_ANONYMOUS, MINIMUM_PUBLISH_BID } from 'constants/c
import * as icons from 'constants/icons';
import type { Claim } from 'types/claim';
import BidHelpText from './internal/bid-help-text';
import NameHelpText from './internal/name-help-text';
import LicenseType from './internal/license-type';
type Props = {
@ -53,8 +54,9 @@ type Props = {
clearPublish: () => void,
resolveUri: string => void,
scrollToTop: () => void,
prepareEdit: ({ }) => void,
prepareEdit: ({}) => void,
resetThumbnailStatus: () => void,
amountNeededForTakeover: ?number,
};
class PublishForm extends React.PureComponent<Props> {
@ -84,6 +86,7 @@ class PublishForm extends React.PureComponent<Props> {
// If they are midway through a channel creation, treat it as anonymous until it completes
const channelName = channel === CHANNEL_ANONYMOUS || channel === CHANNEL_NEW ? '' : channel;
// We are only going to store the full uri, but we need to resolve the uri with and without the channel name
let uri;
try {
uri = buildURI({ contentName: name, channelName });
@ -92,6 +95,11 @@ class PublishForm extends React.PureComponent<Props> {
}
if (uri) {
if (channelName) {
// resolve without the channel name so we know the winning bid for it
const uriLessChannel = buildURI({ contentName: name });
resolveUri(uriLessChannel);
}
resolveUri(uri);
return uri;
}
@ -295,8 +303,9 @@ class PublishForm extends React.PureComponent<Props> {
{name && nameError && <div>{__('The URL you created is not valid')}</div>}
{!bid && <div>{__('A bid amount is required')}</div>}
{!!bid && bidError && <div>{bidError}</div>}
{uploadThumbnailStatus === THUMBNAIL_STATUSES.IN_PROGRESS
&& <div>{__('Please wait for thumbnail to finish uploading')}</div>}
{uploadThumbnailStatus === THUMBNAIL_STATUSES.IN_PROGRESS && (
<div>{__('Please wait for thumbnail to finish uploading')}</div>
)}
{!tosAccepted && <div>{__('You must agree to the terms of service')}</div>}
{!!editingURI &&
!isStillEditing &&
@ -338,6 +347,7 @@ class PublishForm extends React.PureComponent<Props> {
thumbnailPath,
resetThumbnailStatus,
isStillEditing,
amountNeededForTakeover,
} = this.props;
const formDisabled = (!filePath && !editingURI) || publishing;
@ -350,19 +360,17 @@ class PublishForm extends React.PureComponent<Props> {
submitLabel = !publishing ? __('Publish') : __('Publishing...');
}
const shortUri = buildURI({ contentName: name });
return (
<Form onSubmit={this.handlePublish}>
<section className={classnames('card card--section', { 'card--disabled': publishing })}>
<div className="card__title">{__('Content')}</div>
<div className="card__subtitle">
{isStillEditing ? __('Editing a claim') : __('What are you publishing?')}
{' '}{__(
'Read our'
)}{' '}
{isStillEditing ? __('Editing a claim') : __('What are you publishing?')}{' '}
{__('Read our')}{' '}
<Button button="link" label={__('FAQ')} href="https://lbry.io/faq/how-to-publish" />{' '}
{__(
'to learn more.'
)}
{__('to learn more.')}
</div>
{(filePath || !!editingURI) && (
<div className="card-media__internal-links">
@ -496,6 +504,7 @@ class PublishForm extends React.PureComponent<Props> {
<FormRow>
<FormField
stretch
label={__('Name')}
prefix={`lbry://${
!channel || channel === CHANNEL_ANONYMOUS || channel === CHANNEL_NEW
? ''
@ -508,12 +517,9 @@ class PublishForm extends React.PureComponent<Props> {
onChange={event => this.handleNameChange(event.target.value)}
error={nameError}
helper={
<BidHelpText
<NameHelpText
isStillEditing={isStillEditing}
uri={uri}
editingURI={editingURI}
isResolvingUri={isResolvingUri}
winningBidForClaimUri={winningBidForClaimUri}
myClaimForUri={myClaimForUri}
onEditMyClaim={this.editExistingClaim}
/>
@ -534,8 +540,14 @@ class PublishForm extends React.PureComponent<Props> {
min="0"
disabled={!name}
onChange={event => this.handleBidChange(parseFloat(event.target.value))}
helper={__('This LBC remains yours and the deposit can be undone at any time.')}
placeholder={winningBidForClaimUri ? winningBidForClaimUri + 0.1 : 0.1}
helper={
<BidHelpText
uri={shortUri}
isResolvingUri={isResolvingUri}
amountNeededForTakeover={amountNeededForTakeover}
/>
}
/>
</div>
</section>

View file

@ -3,9 +3,10 @@ import {
makeSelectClaimRewardError,
makeSelectRewardByType,
makeSelectIsRewardClaimPending,
} from 'redux/selectors/rewards';
doClaimRewardType,
doClaimRewardClearError,
} from 'lbryinc';
import { doNavigate } from 'redux/actions/navigation';
import { doClaimRewardType, doClaimRewardClearError } from 'redux/actions/rewards';
import RewardLink from './view';
const makeSelect = () => {
@ -23,9 +24,12 @@ const makeSelect = () => {
};
const perform = dispatch => ({
claimReward: reward => dispatch(doClaimRewardType(reward.reward_type, true)),
claimReward: reward => dispatch(doClaimRewardType(reward.reward_type)),
clearError: reward => dispatch(doClaimRewardClearError(reward)),
navigate: path => dispatch(doNavigate(path)),
});
export default connect(makeSelect, perform)(RewardLink);
export default connect(
makeSelect,
perform
)(RewardLink);

View file

@ -1,10 +1,12 @@
import React from 'react';
import { connect } from 'react-redux';
import { selectClaimedRewards } from 'redux/selectors/rewards';
import { selectClaimedRewards } from 'lbryinc';
import RewardListClaimed from './view';
const select = state => ({
rewards: selectClaimedRewards(state),
});
export default connect(select, null)(RewardListClaimed);
export default connect(
select,
null
)(RewardListClaimed);

View file

@ -1,6 +1,5 @@
import { connect } from 'react-redux';
import { selectUnclaimedRewardValue, selectFetchingRewards } from 'redux/selectors/rewards';
import { doRewardList } from 'redux/actions/rewards';
import { selectUnclaimedRewardValue, selectFetchingRewards, doRewardList } from 'lbryinc';
import { doFetchRewardedContent } from 'redux/actions/content';
import RewardSummary from './view';

View file

@ -1,5 +1,12 @@
import React from 'react';
import { connect } from 'react-redux';
import { MODALS, doNotify } from 'lbry-redux';
import RewardTile from './view';
export default connect(null, null)(RewardTile);
const perform = dispatch => ({
openRewardCodeModal: () => dispatch(doNotify({ id: MODALS.REWARD_GENERATED_CODE })),
});
export default connect(
null,
perform
)(RewardTile);

View file

@ -3,10 +3,11 @@ import React from 'react';
import Icon from 'component/common/icon';
import RewardLink from 'component/rewardLink';
import Button from 'component/button';
import rewards from 'rewards';
import { rewards } from 'lbryinc';
import * as icons from 'constants/icons';
type Props = {
openRewardCodeModal: () => void,
reward: {
id: string,
reward_title: string,
@ -19,7 +20,7 @@ type Props = {
};
const RewardTile = (props: Props) => {
const { reward } = props;
const { reward, openRewardCodeModal } = props;
const claimed = !!reward.transaction_id;
return (
@ -27,6 +28,9 @@ const RewardTile = (props: Props) => {
<div className="card__title">{reward.reward_title}</div>
<div className="card__subtitle">{reward.reward_description}</div>
<div className="card__actions">
{reward.reward_type === rewards.TYPE_GENERATED_CODE && (
<Button button="primary" onClick={openRewardCodeModal} label={__('Enter Code')} />
)}
{reward.reward_type === rewards.TYPE_REFERRAL && (
<Button button="primary" navigate="/invite" label={__('Go To Invites')} />
)}

View file

@ -18,6 +18,7 @@ import InvitePage from 'page/invite';
import BackupPage from 'page/backup';
import SubscriptionsPage from 'page/subscriptions';
import SearchPage from 'page/search';
import UserHistoryPage from 'page/userHistory';
const route = (props, page, routesMap) => {
const component = routesMap[page];
@ -53,6 +54,7 @@ const Router = props => {
wallet: <WalletPage params={params} />,
subscriptions: <SubscriptionsPage params={params} />,
search: <SearchPage {...params} />,
user_history: <UserHistoryPage {...params} />,
});
};

View file

@ -55,13 +55,24 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
const thumbnailSrc =
!thumbnail || thumbnailError ? Native.imagePath(thumbnailErrorImage) : thumbnail;
/*
Note:
We are using backgroundImage instead of an <img /> to zoom if the selected thumbnail isn't
the proper aspect ratio. This is to avoid blackbars on the side of images and inconsistent thumbnails
We still need to render the image to see if there is an error loading the url
*/
return (
<div className="card__content">
{status === THUMBNAIL_STATUSES.API_DOWN || status === THUMBNAIL_STATUSES.MANUAL ? (
<div className="column">
<div
className="column__item thumbnail-preview card__media"
style={{ backgroundImage: `url(${thumbnailSrc})` }}
>
<img
style={{ display: 'none' }}
src={thumbnailSrc}
className="column__item thumbnail-preview"
alt={__('Thumbnail Preview')}
onError={() => {
this.setState({
@ -71,6 +82,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
});
}}
/>
</div>
<div className="column__item">
<FormField
className="input--thumbnail"

View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import { selectNavLinks } from 'lbry-redux';
import { selectNavLinks } from 'redux/selectors/app';
import { selectNotifications } from 'redux/selectors/subscriptions';
import SideBar from './view';

View file

@ -0,0 +1,9 @@
import { connect } from 'react-redux';
import { makeSelectClaimForUri } from 'lbry-redux';
import SocialShare from './view';
const select = (state, props) => ({
claim: makeSelectClaimForUri(props.uri)(state),
});
export default connect(select)(SocialShare);

View file

@ -0,0 +1,79 @@
// @flow
import React from 'react';
import type { Claim } from 'types/claim';
import Button from 'component/button';
import * as icons from 'constants/icons';
import Tooltip from 'component/common/tooltip';
import Address from 'component/address';
type Props = {
claim: Claim,
onDone: () => void,
};
class SocialShare extends React.PureComponent<Props> {
constructor(props: Props) {
super(props);
this.input = undefined;
}
input: ?HTMLInputElement;
render() {
const {
claim_id: claimId,
name: claimName,
channel_name: channelName,
value,
} = this.props.claim;
const channelClaimId =
value && value.publisherSignature && value.publisherSignature.certificateId;
const { onDone } = this.props;
const speechPrefix = 'http://spee.ch/';
const speechURL =
channelName && channelClaimId
? `${speechPrefix}${channelName}:${channelClaimId}/${claimName}`
: `${speechPrefix}${claimName}#${claimId}`;
return (
<section className="card__content">
<Address address={speechURL} noSnackbar />
<div className="card__actions card__actions--center">
<Tooltip onComponent body={__('Facebook')}>
<Button
iconColor="blue"
icon={icons.FACEBOOK}
button="alt"
label={__('')}
href={`https://facebook.com/sharer/sharer.php?u=${speechURL}`}
/>
</Tooltip>
<Tooltip onComponent body={__('Twitter')}>
<Button
iconColor="blue"
icon={icons.TWITTER}
button="alt"
label={__('')}
href={`https://twitter.com/home?status=${speechURL}`}
/>
</Tooltip>
<Tooltip onComponent body={__('View on Spee.ch')}>
<Button
icon={icons.GLOBE}
iconColor="blue"
button="alt"
label={__('')}
href={`${speechURL}`}
/>
</Tooltip>
</div>
<div className="card__actions">
<Button button="link" label={__('Done')} onClick={onDone} />
</div>
</section>
);
}
}
export default SocialShare;

View file

@ -1,8 +1,7 @@
import { connect } from 'react-redux';
import { selectClaimedRewardsByTransactionId } from 'redux/selectors/rewards';
import { selectClaimedRewardsByTransactionId } from 'lbryinc';
import { doNavigate } from 'redux/actions/navigation';
import { doNotify } from 'lbry-redux';
import { selectAllMyClaimsByOutpoint } from 'lbry-redux';
import { selectAllMyClaimsByOutpoint, doNotify } from 'lbry-redux';
import TransactionList from './view';
const select = state => ({
@ -15,4 +14,7 @@ const perform = dispatch => ({
openModal: (modal, props) => dispatch(doNotify(modal, props)),
});
export default connect(select, perform)(TransactionList);
export default connect(
select,
perform
)(TransactionList);

View file

@ -1,7 +1,5 @@
import React from 'react';
import { connect } from 'react-redux';
import { doUserEmailNew, doUserInviteNew } from 'redux/actions/user';
import { selectEmailNewIsPending, selectEmailNewErrorMessage } from 'redux/selectors/user';
import { selectEmailNewIsPending, selectEmailNewErrorMessage, doUserEmailNew } from 'lbryinc';
import UserEmailNew from './view';
const select = state => ({
@ -13,4 +11,7 @@ const perform = dispatch => ({
addUserEmail: email => dispatch(doUserEmailNew(email)),
});
export default connect(select, perform)(UserEmailNew);
export default connect(
select,
perform
)(UserEmailNew);

View file

@ -47,7 +47,7 @@ class UserEmailNew extends React.PureComponent<Props, State> {
</p>
<p>{__("We'll never sell your email, and you can unsubscribe at any time.")}</p>
<Form onSubmit={this.handleSubmit}>
<FormRow>
<FormRow padded>
<FormField
stretch
type="email"
@ -63,6 +63,9 @@ class UserEmailNew extends React.PureComponent<Props, State> {
<Submit label="Submit" disabled={isPending} />
{cancelButton}
</div>
<div className="card__content help">
{`${__('Your email may be used to sync usage data across devices.')} `}
</div>
</Form>
</div>
);

View file

@ -1,14 +1,12 @@
import { connect } from 'react-redux';
import {
doUserEmailVerify,
doUserEmailVerifyFailure,
doUserResendVerificationEmail,
} from 'redux/actions/user';
import {
selectEmailVerifyIsPending,
selectEmailToVerify,
selectEmailVerifyErrorMessage,
} from 'redux/selectors/user';
doUserEmailVerify,
doUserEmailVerifyFailure,
doUserResendVerificationEmail,
} from 'lbryinc';
import UserEmailVerify from './view';
const select = state => ({
@ -23,4 +21,7 @@ const perform = dispatch => ({
resendVerificationEmail: email => dispatch(doUserResendVerificationEmail(email)),
});
export default connect(select, perform)(UserEmailVerify);
export default connect(
select,
perform
)(UserEmailVerify);

View file

@ -56,7 +56,7 @@ class UserEmailVerify extends React.PureComponent<Props, State> {
return (
<Form onSubmit={this.handleSubmit}>
<p>Please enter the verification code emailed to {email}.</p>
<FormRow>
<FormRow padded>
<FormField
stretch
name="code"

View file

@ -0,0 +1,27 @@
import { connect } from 'react-redux';
import { selectHistoryPageCount, makeSelectHistoryForPage } from 'redux/selectors/content';
import { doNavigate } from 'redux/actions/navigation';
import { selectCurrentParams, makeSelectCurrentParam } from 'lbry-redux';
import { doClearContentHistoryUri } from 'redux/actions/content';
import UserHistory from './view';
const select = state => {
const paramPage = Number(makeSelectCurrentParam('page')(state) || 0);
return {
pageCount: selectHistoryPageCount(state),
page: paramPage,
params: selectCurrentParams(state),
history: makeSelectHistoryForPage(paramPage)(state),
};
};
const perform = dispatch => ({
navigate: (path, params) => dispatch(doNavigate(path, params)),
clearHistoryUri: uri => dispatch(doClearContentHistoryUri(uri)),
});
export default connect(
select,
perform
)(UserHistory);

View file

@ -0,0 +1,167 @@
// @flow
import * as React from 'react';
import Button from 'component/button';
import { FormField, FormRow } from 'component/common/form';
import ReactPaginate from 'react-paginate';
import UserHistoryItem from 'component/userHistoryItem';
type HistoryItem = {
uri: string,
lastViewed: number,
};
type Props = {
history: Array<HistoryItem>,
page: number,
pageCount: number,
navigate: (string, {}) => void,
clearHistoryUri: string => void,
params: { page: number },
};
type State = {
itemsSelected: {},
};
class UserHistoryPage extends React.PureComponent<Props, State> {
constructor() {
super();
this.state = {
itemsSelected: {},
};
(this: any).selectAll = this.selectAll.bind(this);
(this: any).unselectAll = this.unselectAll.bind(this);
(this: any).removeSelected = this.removeSelected.bind(this);
}
onSelect(uri: string) {
const { itemsSelected } = this.state;
const newItemsSelected = { ...itemsSelected };
if (itemsSelected[uri]) {
delete newItemsSelected[uri];
} else {
newItemsSelected[uri] = true;
}
this.setState({
itemsSelected: { ...newItemsSelected },
});
}
changePage(pageNumber: number) {
const { params } = this.props;
const newParams = { ...params, page: pageNumber };
this.props.navigate('/user_history', newParams);
}
paginate(e: SyntheticKeyboardEvent<*>) {
const pageFromInput = Number(e.currentTarget.value);
if (
pageFromInput &&
e.keyCode === 13 &&
!Number.isNaN(pageFromInput) &&
pageFromInput > 0 &&
pageFromInput <= this.props.pageCount
) {
this.changePage(pageFromInput);
}
}
selectAll() {
const { history } = this.props;
const newSelectedState = {};
history.forEach(({ uri }) => (newSelectedState[uri] = true));
this.setState({ itemsSelected: newSelectedState });
}
unselectAll() {
this.setState({
itemsSelected: {},
});
}
removeSelected() {
const { clearHistoryUri } = this.props;
const { itemsSelected } = this.state;
Object.keys(itemsSelected).forEach(uri => clearHistoryUri(uri));
this.setState({
itemsSelected: {},
});
}
render() {
const { history, page, pageCount } = this.props;
const { itemsSelected } = this.state;
const allSelected = Object.keys(itemsSelected).length === history.length;
const selectHandler = allSelected ? this.unselectAll : this.selectAll;
return (
<React.Fragment>
<div className="card__actions card__actions--between">
{Object.keys(itemsSelected).length ? (
<Button button="link" label={__('Delete')} onClick={this.removeSelected} />
) : (
<span>
{/* Using an empty span so spacing stays the same if the button isn't rendered */}
</span>
)}
<Button
button="link"
label={allSelected ? __('Cancel') : __('Select All')}
onClick={selectHandler}
/>
</div>
{!!history.length && (
<table className="card--section table table--stretch table--history">
<tbody>
{history.map(item => (
<UserHistoryItem
key={item.uri}
uri={item.uri}
lastViewed={item.lastViewed}
selected={!!itemsSelected[item.uri]}
onSelect={() => {
this.onSelect(item.uri);
}}
/>
))}
</tbody>
</table>
)}
{pageCount > 1 && (
<FormRow padded verticallyCentered centered>
<ReactPaginate
pageCount={pageCount}
pageRangeDisplayed={2}
previousLabel=""
nextLabel=""
activeClassName="pagination__item--selected"
pageClassName="pagination__item"
previousClassName="pagination__item pagination__item--previous"
nextClassName="pagination__item pagination__item--next"
breakClassName="pagination__item pagination__item--break"
marginPagesDisplayed={2}
onPageChange={e => this.changePage(e.selected)}
forcePage={page}
initialPage={page}
containerClassName="pagination"
/>
<FormField
className="paginate-channel"
onKeyUp={e => this.paginate(e)}
prefix={__('Go to page:')}
type="text"
/>
</FormRow>
)}
</React.Fragment>
);
}
}
export default UserHistoryPage;

View file

@ -0,0 +1,16 @@
import { connect } from 'react-redux';
import { doResolveUri, makeSelectClaimForUri } from 'lbry-redux';
import UserHistoryItem from './view';
const select = (state, props) => ({
claim: makeSelectClaimForUri(props.uri)(state),
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri)),
});
export default connect(
select,
perform
)(UserHistoryItem);

View file

@ -0,0 +1,64 @@
// @flow
import React from 'react';
import type { Claim } from 'types/claim';
import moment from 'moment';
import classnames from 'classnames';
import Button from 'component/button';
type Props = {
lastViewed: number,
uri: string,
claim: ?Claim,
selected: boolean,
onSelect: () => void,
resolveUri: string => void,
};
class UserHistoryItem extends React.PureComponent<Props> {
componentDidMount() {
const { claim, uri, resolveUri } = this.props;
if (!claim) {
resolveUri(uri);
}
}
render() {
const { lastViewed, selected, onSelect, claim } = this.props;
let name;
let title;
let uri;
if (claim && claim.value && claim.value.stream) {
({ name } = claim);
({ title } = claim.value.stream.metadata);
uri = claim.permanent_url;
}
return (
<tr
onClick={onSelect}
className={classnames({
history__selected: selected,
})}
>
<td>
<input checked={selected} type="checkbox" onClick={onSelect} />
</td>
<td>{moment(lastViewed).from(moment())}</td>
<td>{title}</td>
<td>
<Button
tourniquet
button="link"
label={name ? `lbry://${name}` : `lbry://...`}
navigate="/show"
navigateParams={{ uri }}
/>
</td>
</tr>
);
}
}
export default UserHistoryItem;

View file

@ -1,7 +1,5 @@
import React from 'react';
import { connect } from 'react-redux';
import { doUserPhoneNew } from 'redux/actions/user';
import { selectPhoneNewErrorMessage } from 'redux/selectors/user';
import { selectPhoneNewErrorMessage, doUserPhoneNew } from 'lbryinc';
import UserPhoneNew from './view';
const select = state => ({
@ -9,7 +7,10 @@ const select = state => ({
});
const perform = dispatch => ({
addUserPhone: (phone, country_code) => dispatch(doUserPhoneNew(phone, country_code)),
addUserPhone: (phone, countryCode) => dispatch(doUserPhoneNew(phone, countryCode)),
});
export default connect(select, perform)(UserPhoneNew);
export default connect(
select,
perform
)(UserPhoneNew);

View file

@ -1,11 +1,11 @@
import React from 'react';
import { connect } from 'react-redux';
import { doUserPhoneVerify, doUserPhoneReset } from 'redux/actions/user';
import {
doUserPhoneVerify,
doUserPhoneReset,
selectPhoneToVerify,
selectPhoneVerifyErrorMessage,
selectUserCountryCode,
} from 'redux/selectors/user';
} from 'lbryinc';
import UserPhoneVerify from './view';
const select = state => ({
@ -19,4 +19,7 @@ const perform = dispatch => ({
verifyUserPhone: code => dispatch(doUserPhoneVerify(code)),
});
export default connect(select, perform)(UserPhoneVerify);
export default connect(
select,
perform
)(UserPhoneVerify);

View file

@ -1,13 +1,13 @@
import { connect } from 'react-redux';
import { doNotify, MODALS } from 'lbry-redux';
import { doNavigate } from 'redux/actions/navigation';
import { doUserIdentityVerify } from 'redux/actions/user';
import rewards from 'rewards';
import { makeSelectRewardByType } from 'redux/selectors/rewards';
import {
doUserIdentityVerify,
rewards,
makeSelectRewardByType,
selectIdentityVerifyIsPending,
selectIdentityVerifyErrorMessage,
} from 'redux/selectors/user';
} from 'lbryinc';
import UserVerify from './view';
const select = state => {
@ -26,4 +26,7 @@ const perform = dispatch => ({
verifyPhone: () => dispatch(doNotify({ id: MODALS.PHONE_COLLECTION })),
});
export default connect(select, perform)(UserVerify);
export default connect(
select,
perform
)(UserVerify);

View file

@ -2,7 +2,7 @@
import * as React from 'react';
import Button from 'component/button';
import CardVerify from 'component/cardVerify';
import lbryio from 'lbryio';
import Lbryio from 'lbryinc';
import * as icons from 'constants/icons';
type Props = {
@ -51,7 +51,7 @@ class UserVerify extends React.PureComponent<Props> {
label={__('Perform Card Verification')}
disabled={isPending}
token={this.onToken}
stripeKey={lbryio.getStripeToken()}
stripeKey={Lbryio.getStripeToken()}
/>
</div>
<div className="card__content">

View file

@ -2,7 +2,6 @@
import React from 'react';
import Button from 'component/button';
import { FormField } from 'component/common/form';
import UriIndicator from 'component/uriIndicator';
import type { Claim } from 'types/claim';
type Props = {
@ -18,7 +17,7 @@ type Props = {
type State = {
tipAmount: number,
newTipError: string,
tipError: string,
};
class WalletSendTip extends React.PureComponent<Props, State> {
@ -27,9 +26,8 @@ class WalletSendTip extends React.PureComponent<Props, State> {
this.state = {
tipAmount: 0,
newTipError: '',
tipError: '',
};
(this: any).handleSendButtonClicked = this.handleSendButtonClicked.bind(this);
}
@ -48,37 +46,46 @@ class WalletSendTip extends React.PureComponent<Props, State> {
handleSupportPriceChange(event: SyntheticInputEvent<*>) {
const { balance } = this.props;
const regexp = RegExp(/^(\d*([.]\d{0,8})?)$/);
const validTipInput = regexp.test(event.target.value);
const tipAmount = parseFloat(event.target.value);
let newTipError;
if (tipAmount === balance) {
newTipError = __('Please decrease your tip to account for transaction fees');
let tipError;
if (!tipAmount) {
tipError = __('Tip must be a number');
} else if (tipAmount <= 0) {
tipError = __('Tip must be a positive number');
} else if (!validTipInput) {
tipError = __('Tip must have no more than 8 decimal places');
} else if (tipAmount === balance) {
tipError = __('Please decrease your tip to account for transaction fees');
} else if (tipAmount > balance) {
newTipError = __('Not enough credits');
tipError = __('Not enough credits');
}
this.setState({
tipAmount,
newTipError,
tipError,
});
}
render() {
const { title, isPending, uri, onCancel, balance } = this.props;
const { tipAmount, newTipError } = this.state;
const { title, isPending, uri, onCancel } = this.props;
const { tipAmount, tipError } = this.state;
return (
<div>
<div className="card__title">
<h1>
{__('Send a tip to')} <UriIndicator uri={uri} />
</h1>
</div>
<div className="card__content">
<section className="card__content">
<FormField
label={__('Amount')}
autoFocus
label={
(tipAmount &&
tipAmount !== 0 &&
`Tip ${tipAmount.toFixed(8).replace(/\.?0+$/, '')} LBC`) ||
__('Amount')
}
postfix={__('LBC')}
className="input--price-amount"
error={newTipError}
error={tipError}
min="0"
step="any"
type="number"
@ -86,7 +93,7 @@ class WalletSendTip extends React.PureComponent<Props, State> {
onChange={event => this.handleSupportPriceChange(event)}
helper={
<span>
{__(`This will appear as a tip for ${title} located at ${uri}.`)}{' '}
{__(`This will appear as a tip for "${title}".`)}{' '}
<Button label={__('Learn more')} button="link" href="https://lbry.io/faq/tipping" />
</span>
}
@ -95,18 +102,12 @@ class WalletSendTip extends React.PureComponent<Props, State> {
<Button
button="primary"
label={__('Send')}
disabled={isPending || tipAmount <= 0 || tipAmount > balance || tipAmount === balance}
disabled={isPending || tipError}
onClick={this.handleSendButtonClicked}
/>
<Button
button="link"
label={__('Cancel')}
onClick={onCancel}
navigateParams={{ uri }}
/>
</div>
</div>
<Button button="link" label={__('Cancel')} onClick={onCancel} navigateParams={{ uri }} />
</div>
</section>
);
}
}

View file

@ -73,7 +73,11 @@ export const CREATE_CHANNEL_COMPLETED = 'CREATE_CHANNEL_COMPLETED';
export const PUBLISH_STARTED = 'PUBLISH_STARTED';
export const PUBLISH_COMPLETED = 'PUBLISH_COMPLETED';
export const PUBLISH_FAILED = 'PUBLISH_FAILED';
export const SET_PLAYING_URI = 'PLAY_URI';
export const SET_PLAYING_URI = 'SET_PLAYING_URI';
export const SET_CONTENT_POSITION = 'SET_CONTENT_POSITION';
export const SET_CONTENT_LAST_VIEWED = 'SET_CONTENT_LAST_VIEWED';
export const CLEAR_CONTENT_HISTORY_URI = 'CLEAR_CONTENT_HISTORY_URI';
export const CLEAR_CONTENT_HISTORY_ALL = 'CLEAR_CONTENT_HISTORY_ALL';
// Files
export const FILE_LIST_STARTED = 'FILE_LIST_STARTED';
@ -181,14 +185,6 @@ export const FETCH_SUBSCRIPTIONS_START = 'FETCH_SUBSCRIPTIONS_START';
export const FETCH_SUBSCRIPTIONS_FAIL = 'FETCH_SUBSCRIPTIONS_FAIL';
export const FETCH_SUBSCRIPTIONS_SUCCESS = 'FETCH_SUBSCRIPTIONS_SUCCESS';
// Video controls
export const SET_VIDEO_PAUSE = 'SET_VIDEO_PAUSE';
// Media controls
export const MEDIA_PLAY = 'MEDIA_PLAY';
export const MEDIA_PAUSE = 'MEDIA_PAUSE';
export const MEDIA_POSITION = 'MEDIA_POSITION';
// Publishing
export const CLEAR_PUBLISH = 'CLEAR_PUBLISH';
export const UPDATE_PUBLISH_FORM = 'UPDATE_PUBLISH_FORM';

View file

@ -0,0 +1 @@
export const HISTORY_ITEMS_PER_PAGE = 50;

View file

@ -30,3 +30,5 @@ export const EXTERNAL_LINK = 'ExternalLink';
export const GIFT = 'Gift';
export const EYE = 'Eye';
export const PLAY = 'Play';
export const FACEBOOK = 'Facebook';
export const TWITTER = 'Twitter';

View file

@ -11,9 +11,10 @@ import { doConditionalAuthNavigate, doDaemonReady, doAutoUpdate } from 'redux/ac
import { doNotify, doBlackListedOutpointsSubscribe, isURIValid } from 'lbry-redux';
import { doNavigate } from 'redux/actions/navigation';
import { doDownloadLanguages, doUpdateIsNightAsync } from 'redux/actions/settings';
import { doUserEmailVerify, doAuthenticate } from 'redux/actions/user';
import { doUserEmailVerify, doAuthenticate, Lbryio } from 'lbryinc';
import 'scss/all.scss';
import store from 'store';
import pjson from 'package.json';
import app from './app';
import analytics from './analytics';
import doLogWarningConsoleMessage from './logWarningConsoleMessage';
@ -23,6 +24,40 @@ const APPPAGEURL = 'lbry://?';
autoUpdater.logger = remote.require('electron-log');
// We need to override Lbryio for getting/setting the authToken
// We interect with ipcRenderer to get the auth key from a users keyring
Lbryio.setOverride('setAuthToken', status => {
Lbryio.call(
'user',
'new',
{
auth_token: '',
language: 'en',
app_id: status.installation_id,
},
'post'
).then(response => {
if (!response.auth_token) {
throw new Error(__('auth_token is missing from response'));
}
ipcRenderer.send('set-auth-token', response.auth_token);
});
});
Lbryio.setOverride(
'getAuthToken',
() =>
new Promise(resolve => {
ipcRenderer.once('auth-token-response', (event, token) => {
Lbryio.authToken = token;
resolve(token);
});
ipcRenderer.send('get-auth-token');
})
);
ipcRenderer.on('open-uri-requested', (event, uri, newSession) => {
if (uri && uri.startsWith('lbry://')) {
if (uri.startsWith('lbry://?verify=')) {
@ -156,7 +191,7 @@ const init = () => {
ReactDOM.render(
<Provider store={store}>
<SplashScreen
authenticate={() => app.store.dispatch(doAuthenticate())}
authenticate={() => app.store.dispatch(doAuthenticate(pjson.version))}
onReadyToLaunch={onDaemonReady}
/>
</Provider>,

View file

@ -1,155 +0,0 @@
import { ipcRenderer } from 'electron';
import { Lbry } from 'lbry-redux';
import querystring from 'querystring';
const Lbryio = {
enabled: true,
authenticationPromise: null,
};
const CONNECTION_STRING = process.env.LBRY_APP_API_URL
? process.env.LBRY_APP_API_URL.replace(/\/*$/, '/') // exactly one slash at the end
: 'https://api.lbry.io/';
Lbryio.call = (resource, action, params = {}, method = 'get') => {
if (!Lbryio.enabled) {
console.log(__('Internal API disabled'));
return Promise.reject(new Error(__('LBRY internal API is disabled')));
}
if (!(method === 'get' || method === 'post')) {
return Promise.reject(new Error(__('Invalid method')));
}
function checkAndParse(response) {
if (response.status >= 200 && response.status < 300) {
return response.json();
}
return response.json().then(json => {
let error;
if (json.error) {
error = new Error(json.error);
} else {
error = new Error('Unknown API error signature');
}
error.response = response; // This is primarily a hack used in actions/user.js
return Promise.reject(error);
});
}
function makeRequest(url, options) {
return fetch(url, options).then(checkAndParse);
}
return Lbryio.getAuthToken().then(token => {
const fullParams = { auth_token: token, ...params };
const qs = querystring.stringify(fullParams);
let url = `${CONNECTION_STRING}${resource}/${action}?${qs}`;
let options = {
method: 'GET',
};
if (method === 'post') {
options = {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: qs,
};
url = `${CONNECTION_STRING}${resource}/${action}`;
}
return makeRequest(url, options).then(response => response.data);
});
};
Lbryio.authToken = null;
Lbryio.getAuthToken = () =>
new Promise(resolve => {
if (Lbryio.authToken) {
resolve(Lbryio.authToken);
} else {
ipcRenderer.once('auth-token-response', (event, token) => {
Lbryio.authToken = token;
return resolve(token);
});
ipcRenderer.send('get-auth-token');
}
});
Lbryio.setAuthToken = token => {
Lbryio.authToken = token ? token.toString().trim() : null;
ipcRenderer.send('set-auth-token', token);
};
Lbryio.getCurrentUser = () => Lbryio.call('user', 'me');
Lbryio.authenticate = () => {
if (!Lbryio.enabled) {
return new Promise(resolve => {
resolve({
id: 1,
language: 'en',
primary_email: 'disabled@lbry.io',
has_verified_email: true,
is_identity_verified: true,
is_reward_approved: false,
});
});
}
if (Lbryio.authenticationPromise === null) {
Lbryio.authenticationPromise = new Promise((resolve, reject) => {
Lbryio.getAuthToken()
.then(token => {
if (!token || token.length > 60) {
return false;
}
// check that token works
return Lbryio.getCurrentUser()
.then(() => true)
.catch(() => false);
})
.then(isTokenValid => {
if (isTokenValid) {
return reject;
}
return Lbry.status()
.then(status =>
Lbryio.call(
'user',
'new',
{
auth_token: '',
language: 'en',
app_id: status.installation_id,
},
'post'
)
)
.then(response => {
if (!response.auth_token) {
throw new Error(__('auth_token is missing from response'));
}
return Lbryio.setAuthToken(response.auth_token);
});
})
.then(Lbryio.getCurrentUser)
.then(resolve, reject);
});
}
return Lbryio.authenticationPromise;
};
Lbryio.getStripeToken = () =>
CONNECTION_STRING.startsWith('http://localhost:')
? 'pk_test_NoL1JWL7i1ipfhVId5KfDZgo'
: 'pk_live_e8M4dRNnCCbmpZzduEUZBgJO';
export default Lbryio;

View file

@ -23,6 +23,7 @@ type ModalProps = {
expandButtonLabel?: string,
hideButtonLabel?: string,
fullScreen: boolean,
title: string,
};
export class Modal extends React.PureComponent<ModalProps> {
@ -51,6 +52,7 @@ export class Modal extends React.PureComponent<ModalProps> {
fullScreen,
className,
overlayClassName,
title,
...modalProps
} = this.props;
return (
@ -65,6 +67,7 @@ export class Modal extends React.PureComponent<ModalProps> {
![null, undefined, ''].includes(overlayClassName) ? overlayClassName : 'modal-overlay'
}
>
<h1 className="modal__header">{title}</h1>
<div>{children}</div>
{type === 'custom' ? null : ( // custom modals define their own buttons
<div className="card__actions card__actions--center">

View file

@ -1,8 +1,18 @@
// @flow
import React from 'react';
import FilePrice from 'component/filePrice';
import { Modal } from 'modal/modal';
import type { Metadata } from 'types/claim';
class ModalAffirmPurchase extends React.PureComponent {
type Props = {
closeModal: () => void,
loadVideo: string => void,
uri: string,
cancelPurchase: () => void,
metadata: Metadata,
};
class ModalAffirmPurchase extends React.PureComponent<Props> {
constructor() {
super();
@ -25,15 +35,18 @@ class ModalAffirmPurchase extends React.PureComponent {
<Modal
type="confirm"
isOpen
title={__('Confirm Purchase')}
contentLabel={__('Confirm Purchase')}
onConfirmed={this.onAffirmPurchase}
onAborted={cancelPurchase}
>
{__('This will purchase')} <strong>{title}</strong> {__('for')}{' '}
<section className="card__content">
{__('This will purchase')} <strong>{`"${title}"`}</strong> {__('for')}{' '}
<strong>
<FilePrice uri={uri} showFullPrice inheritStyle showLBC={false} />
</strong>{' '}
{__('credits')}.
</section>
</Modal>
);
}

View file

@ -1,7 +1,12 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
class ModalAuthFailure extends React.PureComponent {
type Props = {
close: () => void,
};
class ModalAuthFailure extends React.PureComponent<Props> {
render() {
const { close } = this.props;
@ -9,6 +14,7 @@ class ModalAuthFailure extends React.PureComponent {
<Modal
isOpen
contentLabel={__('Unable to Authenticate')}
title={__('Authentication Failure')}
type="confirm"
confirmButtonLabel={__('Reload')}
abortButtonLabel={__('Continue')}
@ -17,12 +23,13 @@ class ModalAuthFailure extends React.PureComponent {
}}
onAborted={close}
>
<h3>{__('Authentication Failure')}</h3>
<section className="card__content">
<p>
{__(
'If reloading does not fix this, or you see this at every start up, please email help@lbry.io.'
)}
</p>
</section>
</Modal>
);
}

View file

@ -1,11 +1,15 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import { Line } from 'rc-progress';
import Button from 'component/button';
import { ipcRenderer } from 'electron';
const { ipcRenderer } = require('electron');
type Props = {
closeModal: () => void,
declineAutoUpdate: () => void,
};
class ModalAutoUpdateConfirm extends React.PureComponent {
class ModalAutoUpdateConfirm extends React.PureComponent<Props> {
render() {
const { closeModal, declineAutoUpdate } = this.props;
@ -14,6 +18,7 @@ class ModalAutoUpdateConfirm extends React.PureComponent {
isOpen
type="confirm"
contentLabel={__('Update Downloaded')}
title={__('LBRY Update Ready')}
confirmButtonLabel={__('Upgrade')}
abortButtonLabel={__('Not now')}
onConfirmed={() => {
@ -24,10 +29,9 @@ class ModalAutoUpdateConfirm extends React.PureComponent {
closeModal();
}}
>
<section>
<h3 className="text-center">{__('LBRY Update Ready')}</h3>
<section className="card__content">
<p>{__('Your LBRY update is ready. Restart LBRY now to use it!')}</p>
<p className="meta text-center">
<p className="meta">
{__('Want to know what has changed?')} See the{' '}
<Button
button="link"

View file

@ -26,6 +26,7 @@ class ModalAutoUpdateDownloaded extends React.PureComponent<Props> {
isOpen
type="confirm"
contentLabel={__('Update Downloaded')}
title={__('LBRY Leveled Up')}
confirmButtonLabel={__('Use it Now')}
abortButtonLabel={__('Upgrade on Close')}
confirmButtonDisabled={this.state.disabled}
@ -39,8 +40,7 @@ class ModalAutoUpdateDownloaded extends React.PureComponent<Props> {
closeModal();
}}
>
<section>
<h3 className="text-center">{__('LBRY Leveled Up')}</h3>
<section className="card__content">
<p>
{__(
'A new version of LBRY has been released, downloaded, and is ready for you to use pending a restart.'

View file

@ -25,12 +25,14 @@ class ModalConfirmThumbnailUpload extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Upload Thumbnail')}
contentLabel={__('Confirm Thumbnail Upload')}
type="confirm"
confirmButtonLabel={__('Upload')}
onConfirmed={() => this.upload()}
onAborted={closeModal}
>
<section className="card__content">
<p>{__('Are you sure you want to upload this thumbnail to spee.ch')}?</p>
<blockquote>{path}</blockquote>
<FormField
@ -40,6 +42,7 @@ class ModalConfirmThumbnailUpload extends React.PureComponent<Props> {
checked={nsfw}
onChange={event => updatePublishForm({ nsfw: event.target.checked })}
/>
</section>
</Modal>
);
}

View file

@ -21,21 +21,20 @@ class ModalConfirmTransaction extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Send LBC')}
contentLabel={__('Confirm Transaction')}
type="confirm"
confirmButtonLabel={__('Continue')}
confirmButtonLabel={__('Send')}
onConfirmed={() => this.onConfirmed()}
onAborted={closeModal}
>
<p>{__('Are you sure you want to ')}</p>
<h1>
{__('send ')} {amount} LBC
</h1>
<section className="card__content">
<p>{__('Sending: ')}</p>
<blockquote>{amount} LBC</blockquote>
<p>{__('To address: ')}</p>
<blockquote>{address}</blockquote>
<p>{__('Once the transaction is sent, it cannot be reversed.')}</p>
</section>
</Modal>
);
}

View file

@ -1,9 +1,8 @@
import { connect } from 'react-redux';
import { doNavigate } from 'redux/actions/navigation';
import { doSetClientSetting } from 'redux/actions/settings';
import { selectUserIsRewardApproved } from 'redux/selectors/user';
import { selectUserIsRewardApproved, selectUnclaimedRewardValue } from 'lbryinc';
import { selectBalance, doHideNotification } from 'lbry-redux';
import { selectUnclaimedRewardValue } from 'redux/selectors/rewards';
import * as settings from 'constants/settings';
import ModalCreditIntro from './view';
@ -25,4 +24,7 @@ const perform = dispatch => () => ({
},
});
export default connect(select, perform)(ModalCreditIntro);
export default connect(
select,
perform
)(ModalCreditIntro);

View file

@ -17,9 +17,8 @@ const ModalCreditIntro = (props: Props) => {
const totalRewardRounded = Math.floor(totalRewardValue / 10) * 10;
return (
<Modal type="custom" isOpen contentLabel="Welcome to LBRY">
<section>
<h3 className="modal__header">{__('Computer Wizard Needs Tokens Badly')}</h3>
<Modal type="custom" isOpen contentLabel="Welcome to LBRY" title={__('LBRY Credits Needed')}>
<section className="card__content">
<p>
Some actions require LBRY credits (<em>
<CurrencySymbol />

View file

@ -1,9 +1,18 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import { Line } from 'rc-progress';
import Button from 'component/button';
class ModalDownloading extends React.PureComponent {
type Props = {
downloadProgress: ?number,
downloadComplete: boolean,
downloadItem: string,
startUpgrade: () => void,
cancelUpgrade: () => void,
};
class ModalDownloading extends React.PureComponent<Props> {
render() {
const {
downloadProgress,
@ -14,13 +23,17 @@ class ModalDownloading extends React.PureComponent {
} = this.props;
return (
<Modal isOpen contentLabel={__('Downloading Update')} type="custom">
{__('Downloading Update')}
{downloadProgress ? `: ${downloadProgress}%` : null}
<Modal
title={__('Downloading Update')}
isOpen
contentLabel={__('Downloading Update')}
type="custom"
>
<section className="card__content">
{downloadProgress ? `${downloadProgress}% ${__('complete')}` : null}
<Line percent={downloadProgress || 0} strokeWidth="4" />
{downloadComplete ? (
<div>
<br />
<React.Fragment>
<p>{__('Click "Begin Upgrade" to start the upgrade process.')}</p>
<p>
{__(
@ -34,7 +47,7 @@ class ModalDownloading extends React.PureComponent {
</p>
<blockquote>sudo dpkg -i {downloadItem}</blockquote>
<p>{__('After the install is complete, please reopen the app.')}</p>
</div>
</React.Fragment>
) : null}
<div className="modal__buttons">
{downloadComplete ? (
@ -52,6 +65,7 @@ class ModalDownloading extends React.PureComponent {
onClick={cancelUpgrade}
/>
</div>
</section>
</Modal>
);
}

View file

@ -2,7 +2,7 @@ import * as settings from 'constants/settings';
import { connect } from 'react-redux';
import { doHideNotification } from 'lbry-redux';
import { doSetClientSetting } from 'redux/actions/settings';
import { selectEmailToVerify, selectUser } from 'redux/selectors/user';
import { selectEmailToVerify, selectUser } from 'lbryinc';
import ModalEmailCollection from './view';
const select = state => ({
@ -17,4 +17,7 @@ const perform = dispatch => () => ({
},
});
export default connect(select, perform)(ModalEmailCollection);
export default connect(
select,
perform
)(ModalEmailCollection);

View file

@ -16,7 +16,6 @@ class ModalEmailCollection extends React.PureComponent<Props> {
const { closeModal, email, user } = this.props;
const cancelButton = <Button button="link" onClick={closeModal} label={__('Not Now')} />;
if (user && !user.has_verified_email && !email) {
return <UserEmailNew cancelButton={cancelButton} />;
} else if (user && !user.has_verified_email) {
@ -35,16 +34,8 @@ class ModalEmailCollection extends React.PureComponent<Props> {
}
return (
<Modal type="custom" isOpen contentLabel="Email">
<section>
<h3 className="modal__header">Can We Stay In Touch?</h3>
<div className="card__content">{this.renderInner()}</div>
<div className="card__content">
<div className="help">
{`${__('Your email may be used to sync usage data across devices.')} `}
</div>
</div>
</section>
<Modal type="custom" isOpen contentLabel="Email" title={__('Can We Stay In Touch?')}>
<section className="card__content">{this.renderInner()}</section>
</Modal>
);
}

View file

@ -1,8 +1,14 @@
// @flow
import React from 'react';
import Native from 'native';
import { ExpandableModal } from 'modal/modal';
class ModalError extends React.PureComponent {
type Props = {
error: string | { message: string },
closeModal: () => void,
};
class ModalError extends React.PureComponent<Props> {
render() {
const { closeModal, error } = this.props;
@ -23,37 +29,39 @@ class ModalError extends React.PureComponent {
const label = errorKeyLabels[key];
errorInfoList.push(
<li key={key}>
<strong>{label}</strong>: <code>{val}</code>
<strong>{label}</strong>: {val}
</li>
);
}
const errorInfo = <ul className="error-modal__error-list">{errorInfoList}</ul>;
return (
<ExpandableModal
isOpen
contentLabel={__('Error')}
className="error-modal"
overlayClassName="error-modal-overlay"
onConfirmed={closeModal}
extraContent={errorInfo}
>
<h3 className="modal__header">{__('Error')}</h3>
<div className="error-modal__content">
<div>
title={
<React.Fragment>
{__('Error')}{' '}
<img
alt=""
className="error-modal__warning-symbol"
src={Native.imagePath('warning.png')}
/>
</div>
</React.Fragment>
}
className="error-modal"
overlayClassName="error-modal-overlay"
onConfirmed={closeModal}
extraContent={errorInfo}
>
<section className="card__content">
<p>
{__(
"We're sorry that LBRY has encountered an error. This has been reported and we will investigate the problem."
)}
</p>
</div>
</section>
</ExpandableModal>
);
}

View file

@ -1,15 +1,33 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import type { Metadata } from 'types/claim';
class ModalFileTimeout extends React.PureComponent {
type Props = {
metadata: Metadata,
closeModal: () => void,
};
class ModalFileTimeout extends React.PureComponent<Props> {
render() {
const {
metadata: { title },
closeModal,
} = this.props;
return (
<Modal isOpen contentLabel={__('Download failed')} onConfirmed={closeModal}>
{__('LBRY was unable to download the stream')} <strong>{title}</strong>.
<Modal
isOpen
title={__('Unable to Download')}
contentLabel={__('Download failed')}
onConfirmed={closeModal}
>
<section className="card__content">
<p className="card__error-msg">
{__('LBRY was unable to download the stream')}:
<div>{`"${title}"`}</div>
</p>
</section>
</Modal>
);
}

View file

@ -1,7 +1,6 @@
import rewards from 'rewards';
import { rewards, makeSelectRewardByType } from 'lbryinc';
import { connect } from 'react-redux';
import { doHideNotification } from 'lbry-redux';
import { makeSelectRewardByType } from 'redux/selectors/rewards';
import ModalFirstReward from './view';
const select = state => {
@ -16,4 +15,7 @@ const perform = dispatch => ({
closeModal: () => dispatch(doHideNotification()),
});
export default connect(select, perform)(ModalFirstReward);
export default connect(
select,
perform
)(ModalFirstReward);

View file

@ -1,10 +1,12 @@
// I"ll come back to This
/* esline-disable */
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import CreditAmount from 'component/common/credit-amount';
class ModalFirstReward extends React.PureComponent {
type Props = {
closeModal: () => void,
};
class ModalFirstReward extends React.PureComponent<Props> {
render() {
const { closeModal } = this.props;
@ -14,10 +16,10 @@ class ModalFirstReward extends React.PureComponent {
overlayClassName="modal-overlay modal-overlay--clear"
isOpen
contentLabel={__('Welcome to LBRY')}
title={__('Your First Reward')}
onConfirmed={closeModal}
>
<section>
<h3 className="modal__header">{__('Your First Reward')}</h3>
<section className="card__content">
<p>{__('You just earned your first reward!')}</p>
<p>
{__(
@ -41,4 +43,3 @@ class ModalFirstReward extends React.PureComponent {
}
export default ModalFirstReward;
/* eslint-enable */

View file

@ -1,14 +1,19 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import Button from 'component/button';
const ModalFirstSubscription = props => {
type Props = {
closeModal: () => void,
navigate: string => void,
};
const ModalFirstSubscription = (props: Props) => {
const { closeModal, navigate } = props;
return (
<Modal type="custom" isOpen contentLabel="Subscriptions 101">
<section>
<h3 className="modal__header">{__('Subscriptions 101')}</h3>
<Modal type="custom" isOpen contentLabel="Subscriptions 101" title={__('Subscriptions 101')}>
<section className="card__content">
<p>{__('You just subscribed to your first channel. Awesome!')}</p>
<p>{__('A few quick things to know:')}</p>
<p className="card__content">

View file

@ -15,6 +15,7 @@ class ModalIncompatibleDaemon extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Incompatible Daemon')}
contentLabel={__('Incompatible daemon running')}
type="confirm"
confirmButtonLabel={__('Close LBRY and daemon')}
@ -22,9 +23,11 @@ class ModalIncompatibleDaemon extends React.PureComponent<Props> {
onConfirmed={quitAnyDaemon}
onAborted={quit}
>
<p>
{__(
'This browser is running with an incompatible version of the LBRY protocol, please close the LBRY app and rerun the installation package to repair it. '
)}
</p>
<Button
button="link"
label={__('Learn more')}

View file

@ -23,13 +23,14 @@ class ModalOpenExternalLink extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Warning!')}
contentLabel={__('Confirm External Link')}
type="confirm"
confirmButtonLabel={__('Continue')}
onConfirmed={() => this.openExternalLink()}
onAborted={closeModal}
>
<h1>Warning!</h1>
<section className="card__content">
<p>{__('This link leads to an external website.')}</p>
<blockquote>{uri}</blockquote>
<p>
@ -37,6 +38,7 @@ class ModalOpenExternalLink extends React.PureComponent<Props> {
'LBRY Inc is not responsible for its content, click continue to proceed at your own risk.'
)}
</p>
</section>
</Modal>
);
}

View file

@ -1,9 +1,6 @@
import React from 'react';
import * as settings from 'constants/settings';
import { connect } from 'react-redux';
import { doHideNotification } from 'lbry-redux';
import { doSetClientSetting } from 'redux/actions/settings';
import { selectPhoneToVerify, selectUser } from 'redux/selectors/user';
import { selectPhoneToVerify, selectUser } from 'lbryinc';
import { doNavigate } from 'redux/actions/navigation';
import ModalPhoneCollection from './view';
@ -19,4 +16,7 @@ const perform = dispatch => () => ({
},
});
export default connect(select, perform)(ModalPhoneCollection);
export default connect(
select,
perform
)(ModalPhoneCollection);

View file

@ -1,10 +1,19 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import Button from 'component/button';
import UserPhoneNew from 'component/userPhoneNew';
import UserPhoneVerify from 'component/userPhoneVerify';
class ModalPhoneCollection extends React.PureComponent {
type Props = {
phone: ?number,
user: {
phone_number: ?number,
},
closeModal: () => void,
};
class ModalPhoneCollection extends React.PureComponent<Props> {
renderInner() {
const { closeModal, phone, user } = this.props;
@ -15,7 +24,7 @@ class ModalPhoneCollection extends React.PureComponent {
} else if (!user.phone_number) {
return <UserPhoneVerify cancelButton={cancelButton} />;
}
closeModal();
return closeModal();
}
render() {
@ -27,11 +36,8 @@ class ModalPhoneCollection extends React.PureComponent {
}
return (
<Modal type="custom" isOpen contentLabel="Phone">
<section>
<h3 className="modal__header">Verify Your Phone</h3>
{this.renderInner()}
</section>
<Modal type="custom" isOpen contentLabel="Phone" title={__('Verify Your Phone')}>
<section className="card__content">{this.renderInner()}</section>
</Modal>
);
}

View file

@ -16,6 +16,7 @@ class ModalSendTip extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Success')}
contentLabel={__('File published')}
onConfirmed={() => {
clearPublish();
@ -23,6 +24,7 @@ class ModalSendTip extends React.PureComponent<Props> {
closeModal();
}}
>
<section className="card__content">
<p>{__('Your file has been published to LBRY at the address')}</p>
<p className="card__success-msg">{uri}</p>
<p>
@ -30,6 +32,7 @@ class ModalSendTip extends React.PureComponent<Props> {
'The file will take a few minutes to appear for other LBRY users. Until then it will be listed as "pending" under your published files.'
)}
</p>
</section>
</Modal>
);
}

View file

@ -60,14 +60,17 @@ class ModalRemoveFile extends React.PureComponent<Props, State> {
return (
<Modal
isOpen
title={__('Remove File')}
contentLabel={__('Confirm File Remove')}
type="confirm"
confirmButtonLabel={__('Remove')}
onConfirmed={() => deleteFile(outpoint, deleteChecked, abandonClaimChecked)}
onAborted={closeModal}
>
<section className="card__content">
<p>
{__("Are you sure you'd like to remove")} <cite>{title}</cite> {__('from the LBRY app?')}
{__("Are you sure you'd like to remove")} <cite>{`"${title}"`}</cite>{' '}
{__('from the LBRY app?')}
</p>
<FormRow padded>
@ -88,6 +91,7 @@ class ModalRemoveFile extends React.PureComponent<Props, State> {
/>
</FormRow>
)}
</section>
</Modal>
);
}

View file

@ -1,10 +1,52 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import * as txnTypes from 'constants/transaction_types';
class ModalRevokeClaim extends React.PureComponent {
constructor(props) {
super(props);
type Props = {
closeModal: () => void,
abandonClaim: (string, number) => void,
txid: string,
nout: number,
};
class ModalRevokeClaim extends React.PureComponent<Props> {
constructor() {
super();
(this: any).revokeClaim = this.revokeClaim.bind(this);
}
getButtonLabel(type) {
if (type === txnTypes.TIP) {
return 'Confirm Tip Unlock';
}
return 'Confirm Claim Revoke';
}
getMsgBody(type) {
if (type === txnTypes.TIP) {
return (
<React.Fragment>
<p>{__('Are you sure you want to unlock these credits?')}</p>
<p>
{__(
'These credits are permanently yours and can be unlocked at any time. Unlocking them allows you to spend them, but can hurt the performance of your content in lookups and search results. It is recommended you leave tips locked until you need or want to spend them.'
)}
</p>
</React.Fragment>
);
}
return (
<React.Fragment>
<p>{__('Are you sure want to revoke this claim?')}</p>
<p>
{__(
'This will prevent others from resolving and accessing the content you published. It will return the LBC to your spendable balance, less a small transaction fee.'
)}
</p>
</React.Fragment>
);
}
revokeClaim() {
@ -14,52 +56,6 @@ class ModalRevokeClaim extends React.PureComponent {
this.props.abandonClaim(txid, nout);
}
getButtonLabel(type) {
if (type == txnTypes.TIP) {
return 'Confirm Tip Unlock';
}
return 'Confirm Claim Revoke';
}
getMsgBody(type) {
if (type == txnTypes.TIP) {
return (
<div>
<h3>{__('Confirm Tip Unlock')}</h3>
<p>
{__('Are you sure you want to unlock these credits?')}
<br />
<br />
{__(
'These credits are permanently yours and can be\
unlocked at any time. Unlocking them allows you to\
spend them, but can hurt the performance of your\
content in lookups and search results. It is\
recommended you leave tips locked until you\
need or want to spend them.'
)}
</p>
</div>
);
}
return (
<div>
<h3>{__('Confirm Claim Revoke')}</h3>
<p>
{__('Are you sure want to revoke this claim?')}
<br />
<br />
{__(
'This will prevent others from resolving and\
accessing the content you published. It will return\
the LBC to your spendable balance, less a small\
transaction fee.'
)}
</p>
</div>
);
}
render() {
const { transactionItems, txid, nout, closeModal } = this.props;
const { type } = transactionItems.find(claim => claim.txid == txid && claim.nout == nout);
@ -67,13 +63,14 @@ class ModalRevokeClaim extends React.PureComponent {
return (
<Modal
isOpen
title={type === txnTypes.TIP ? __('Confirm Tip Unlock') : __('Confirm Claim Revoke')}
contentLabel={__('Confirm Claim Revoke')}
type="confirm"
confirmButtonLabel={this.getButtonLabel(type)}
onConfirmed={this.revokeClaim.bind(this)}
onConfirmed={this.revokeClaim}
onAborted={closeModal}
>
{this.getMsgBody(type)}
<section className="card__content">{this.getMsgBody(type)}</section>
</Modal>
);
}

View file

@ -1,13 +1,20 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
class ModalRewardApprovalRequired extends React.PureComponent {
type Props = {
closeModal: () => void,
doAuth: () => void,
};
class ModalRewardApprovalRequired extends React.PureComponent<Props> {
render() {
const { closeModal, doAuth } = this.props;
return (
<Modal
isOpen
title={__('Hmm. Are you real?')}
contentLabel={__('Human Verification Required')}
onConfirmed={doAuth}
onAborted={closeModal}
@ -15,8 +22,7 @@ class ModalRewardApprovalRequired extends React.PureComponent {
confirmButtonLabel={__("I'm Totally Real")}
abortButtonLabel={__('Never Mind')}
>
<section>
<h3 className="modal__header">{__('This is awkward. Are you real?')}</h3>
<section className="card__content">
<p>
{__(
"Before we can give you any credits, we need to perform a brief check to make sure you're a new and unique person."

View file

@ -0,0 +1,28 @@
// @flow
import { connect } from 'react-redux';
import { doHideNotification } from 'lbry-redux';
import {
makeSelectClaimRewardError,
doClaimRewardType,
makeSelectIsRewardClaimPending,
rewards as REWARD_TYPES,
} from 'lbryinc';
import ModalRewardCode from './view';
const select = (state): {} => ({
rewardIsPending: makeSelectIsRewardClaimPending()(state, {
reward_type: REWARD_TYPES.TYPE_REWARD_CODE,
}),
error: makeSelectClaimRewardError()(state, { reward_type: REWARD_TYPES.TYPE_REWARD_CODE }),
});
const perform = dispatch => ({
closeModal: () => dispatch(doHideNotification()),
submitRewardCode: (code: string) =>
dispatch(doClaimRewardType(REWARD_TYPES.TYPE_REWARD_CODE, { params: { code } })),
});
export default connect(
select,
perform
)(ModalRewardCode);

View file

@ -0,0 +1,81 @@
// @flow
import * as React from 'react';
import { FormRow, FormField } from 'component/common/form';
import { Modal } from 'modal/modal';
import Button from 'component/button';
type Props = {
closeModal: () => void,
error: ?string,
rewardIsPending: boolean,
submitRewardCode: string => void,
};
type State = {
rewardCode: string,
};
class ModalRewardCode extends React.PureComponent<Props, State> {
constructor() {
super();
this.state = {
rewardCode: '',
};
(this: any).handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit() {
const { rewardCode } = this.state;
const { submitRewardCode } = this.props;
submitRewardCode(rewardCode);
}
render() {
const { closeModal, rewardIsPending, error } = this.props;
const { rewardCode } = this.state;
return (
<Modal
isOpen
title={__('Enter Reward Code')}
contentLabel={__('Enter Reward Code')}
type="confirm"
confirmButtonLabel={__('Redeem')}
abortButtonLabel={__('Cancel')}
onConfirmed={this.handleSubmit}
onAborted={closeModal}
confirmButtonDisabled={rewardIsPending}
>
<section className="card__content">
<FormRow>
<FormField
stretch
autoFocus
type="text"
label={__('Code')}
placeholder="0123abc"
error={error}
value={rewardCode}
onChange={e => this.setState({ rewardCode: e.target.value })}
helper={
<React.Fragment>
{__('Redeem a custom reward code for LBC')}
{'. '}
<Button
button="link"
href="https://lbry.io/faq/rewards#reward-code"
label={__('Learn more')}
/>.
</React.Fragment>
}
/>
</FormRow>
</section>
</Modal>
);
}
}
export default ModalRewardCode;

View file

@ -9,7 +9,7 @@ import {
selectNotificationProps,
} from 'lbry-redux';
import { makeSelectClientSetting } from 'redux/selectors/settings';
import { selectUser, selectUserIsVerificationCandidate } from 'redux/selectors/user';
import { selectUser, selectUserIsVerificationCandidate } from 'lbryinc';
import ModalRouter from './view';
@ -32,4 +32,7 @@ const perform = dispatch => ({
openModal: notification => dispatch(doNotify(notification)),
});
export default connect(select, perform)(ModalRouter);
export default connect(
select,
perform
)(ModalRouter);

View file

@ -1,3 +1,4 @@
// @flow
import React from 'react';
import { MODALS } from 'lbry-redux';
import ModalError from 'modal/modalError';
@ -19,20 +20,23 @@ import ModalEmailCollection from 'modal/modalEmailCollection';
import ModalPhoneCollection from 'modal/modalPhoneCollection';
import ModalFirstSubscription from 'modal/modalFirstSubscription';
import ModalConfirmTransaction from 'modal/modalConfirmTransaction';
import ModalSendTip from '../modalSendTip';
import ModalPublish from '../modalPublish';
import ModalOpenExternalLink from '../modalOpenExternalLink';
import ModalSocialShare from 'modal/modalSocialShare';
import ModalSendTip from 'modal/modalSendTip';
import ModalPublish from 'modal/modalPublish';
import ModalOpenExternalLink from 'modal/modalOpenExternalLink';
import ModalConfirmThumbnailUpload from 'modal/modalConfirmThumbnailUpload';
import ModalWalletEncrypt from 'modal/modalWalletEncrypt';
import ModalWalletDecrypt from 'modal/modalWalletDecrypt';
import ModalWalletUnlock from 'modal/modalWalletUnlock';
import ModalRewardCode from 'modal/modalRewardCode';
type Props = {
modal: string,
notification: { id: string },
notificationProps: {},
};
class ModalRouter extends React.PureComponent<Props> {
constructor(props) {
constructor(props: Props) {
super(props);
this.state = {
@ -50,7 +54,7 @@ class ModalRouter extends React.PureComponent<Props> {
}
showTransitionModals(props) {
const { modal, modalProps, openModal, page } = props;
const { modal, openModal, page } = props;
if (modal) {
return;
@ -79,6 +83,8 @@ class ModalRouter extends React.PureComponent<Props> {
if (!isWelcomeAcknowledged && user && !user.is_reward_approved && !user.is_identity_verified) {
return MODALS.WELCOME;
}
return undefined;
}
checkShowEmail(props) {
@ -91,6 +97,8 @@ class ModalRouter extends React.PureComponent<Props> {
) {
return MODALS.EMAIL_COLLECTION;
}
return undefined;
}
checkShowCreditIntro(props) {
@ -103,6 +111,8 @@ class ModalRouter extends React.PureComponent<Props> {
) {
return MODALS.INSUFFICIENT_CREDITS;
}
return undefined;
}
isPaidShowPage(props) {
@ -160,6 +170,8 @@ class ModalRouter extends React.PureComponent<Props> {
return <ModalFirstSubscription {...notificationProps} />;
case MODALS.SEND_TIP:
return <ModalSendTip {...notificationProps} />;
case MODALS.SOCIAL_SHARE:
return <ModalSocialShare {...notificationProps} />;
case MODALS.PUBLISH:
return <ModalPublish {...notificationProps} />;
case MODALS.CONFIRM_EXTERNAL_LINK:
@ -174,6 +186,8 @@ class ModalRouter extends React.PureComponent<Props> {
return <ModalWalletDecrypt {...notificationProps} />;
case MODALS.WALLET_UNLOCK:
return <ModalWalletUnlock {...notificationProps} />;
case MODALS.REWARD_GENERATED_CODE:
return <ModalRewardCode {...notificationProps} />;
default:
return null;
}

View file

@ -2,6 +2,7 @@
import React from 'react';
import { Modal } from 'modal/modal';
import SendTip from 'component/walletSendTip';
import UriIndicator from 'component/uriIndicator';
type Props = {
closeModal: () => void,
@ -13,7 +14,16 @@ class ModalSendTip extends React.PureComponent<Props> {
const { closeModal, uri } = this.props;
return (
<Modal isOpen type="custom">
<Modal
onAborted={closeModal}
isOpen
type="custom"
title={
<React.Fragment>
{__('Send a tip to')} <UriIndicator uri={uri} />
</React.Fragment>
}
>
<SendTip uri={uri} onCancel={closeModal} sendTipCallback={closeModal} />
</Modal>
);

View file

@ -0,0 +1,12 @@
import { connect } from 'react-redux';
import { doHideNotification } from 'lbry-redux';
import ModalSocialShare from './view';
const perform = dispatch => ({
closeModal: () => dispatch(doHideNotification()),
});
export default connect(
null,
perform
)(ModalSocialShare);

View file

@ -0,0 +1,22 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import SocialShare from 'component/socialShare';
type Props = {
closeModal: () => void,
uri: string,
};
class ModalSocialShare extends React.PureComponent<Props> {
render() {
const { closeModal, uri } = this.props;
return (
<Modal isOpen onAborted={closeModal} type="custom" title={__('Share')}>
<SocialShare uri={uri} onDone={closeModal} />
</Modal>
);
}
}
export default ModalSocialShare;

View file

@ -1,14 +1,22 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
class ModalTransactionFailed extends React.PureComponent {
type Props = {
closeModal: () => void,
};
class ModalTransactionFailed extends React.PureComponent<Props> {
render() {
const { closeModal } = this.props;
return (
<Modal isOpen contentLabel={__('Transaction failed')} onConfirmed={closeModal}>
{__('Transaction failed.')}:
</Modal>
<Modal
isOpen
contentLabel={__('Transaction failed')}
title={__('Transaction Failed')}
onConfirmed={closeModal}
/>
);
}
}

View file

@ -1,8 +1,14 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import Button from 'component/button';
class ModalUpgrade extends React.PureComponent {
type Props = {
downloadUpgrade: () => void,
skipUpgrade: () => void,
};
class ModalUpgrade extends React.PureComponent<Props> {
render() {
const { downloadUpgrade, skipUpgrade } = this.props;
@ -10,19 +16,19 @@ class ModalUpgrade extends React.PureComponent {
<Modal
isOpen
contentLabel={__('Upgrade available')}
title={__('LBRY Leveled Up')}
type="confirm"
confirmButtonLabel={__('Upgrade')}
abortButtonLabel={__('Skip')}
onConfirmed={downloadUpgrade}
onAborted={skipUpgrade}
>
<h3 className="text-center">{__('LBRY Leveled Up')}</h3>
<br />
<div className="card__content">
<p>
{__('An updated version of LBRY is now available.')}{' '}
{__('Your version is out of date and may be unreliable or insecure.')}
</p>
<p className="meta text-center">
<p className="meta">
{__('Want to know what has changed?')} See the{' '}
<Button
button="link"
@ -30,6 +36,7 @@ class ModalUpgrade extends React.PureComponent {
href="https://github.com/lbryio/lbry-desktop/releases"
/>.
</p>
</div>
</Modal>
);
}

View file

@ -1,12 +1,12 @@
// @flow
import React from 'react';
import { Form, FormRow, FormField } from 'component/common/form';
import { Form } from 'component/common/form';
import { Modal } from 'modal/modal';
import Button from 'component/button';
type Props = {
closeModal: () => void,
unlockWallet: string => void,
decryptWallet: () => void,
walletDecryptSucceded: boolean,
updateWalletStatus: boolean,
};
@ -16,11 +16,6 @@ class ModalWalletDecrypt extends React.PureComponent<Props> {
submitted: false, // Prior actions could be marked complete
};
submitDecryptForm() {
this.setState({ submitted: true });
this.props.decryptWallet();
}
componentDidUpdate() {
const { props, state } = this;
@ -30,12 +25,18 @@ class ModalWalletDecrypt extends React.PureComponent<Props> {
}
}
submitDecryptForm() {
this.setState({ submitted: true });
this.props.decryptWallet();
}
render() {
const { closeModal, walletDecryptSucceded } = this.props;
const { closeModalgaa } = this.props;
return (
<Modal
isOpen
title={__('Decrypt Wallet')}
contentLabel={__('Decrypt Wallet')}
type="confirm"
confirmButtonLabel={__('Decrypt Wallet')}
@ -43,10 +44,13 @@ class ModalWalletDecrypt extends React.PureComponent<Props> {
onConfirmed={() => this.submitDecryptForm()}
onAborted={closeModal}
>
<section className="card__content">
<Form onSubmit={() => this.submitDecryptForm()}>
<p>
{__(
'Your wallet has been encrypted with a local password, performing this action will remove this password.'
)}
</p>
<div className="card__actions">
<Button
button="link"
@ -55,6 +59,7 @@ class ModalWalletDecrypt extends React.PureComponent<Props> {
/>
</div>
</Form>
</section>
</Modal>
);
}

View file

@ -82,6 +82,7 @@ class ModalWalletEncrypt extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Encrypt Wallet')}
contentLabel={__('Encrypt Wallet')}
type="confirm"
confirmButtonLabel={__('Encrypt Wallet')}
@ -89,13 +90,17 @@ class ModalWalletEncrypt extends React.PureComponent<Props> {
onConfirmed={() => this.submitEncryptForm()}
onAborted={closeModal}
>
<section className="card__content">
<Form onSubmit={() => this.submitEncryptForm()}>
<p>
{__(
'Encrypting your wallet will require a password to access your local wallet data when LBRY starts. Please enter a new password for your wallet.'
)}
</p>
<FormRow padded>
<FormField
stretch
autoFocus
error={passwordMismatch === true ? 'Passwords do not match' : false}
label={__('New Password')}
type="password"
@ -113,10 +118,11 @@ class ModalWalletEncrypt extends React.PureComponent<Props> {
onChange={event => this.onChangeNewPasswordConfirm(event)}
/>
</FormRow>
<br />
<p>
{__(
'If your password is lost, it cannot be recovered. You will not be able to access your wallet without a password.'
)}
</p>
<FormRow padded>
<FormField
stretch
@ -136,6 +142,7 @@ class ModalWalletEncrypt extends React.PureComponent<Props> {
</div>
{failMessage && <div className="error-text">{__(failMessage)}</div>}
</Form>
</section>
</Modal>
);
}

View file

@ -36,6 +36,7 @@ class ModalWalletUnlock extends React.PureComponent<Props> {
return (
<Modal
isOpen
title={__('Unlock Wallet')}
contentLabel={__('Unlock Wallet')}
type="confirm"
shouldCloseOnOverlayClick={false}
@ -44,13 +45,17 @@ class ModalWalletUnlock extends React.PureComponent<Props> {
onConfirmed={() => unlockWallet(password)}
onAborted={quit}
>
<section className="card__content">
<Form onSubmit={() => unlockWallet(password)}>
<p>
{__(
'Your wallet has been encrypted with a local password. Please enter your wallet password to proceed.'
)}
</p>
<FormRow padded>
<FormField
stretch
autoFocus
error={walletUnlockSucceded === false ? 'Incorrect Password' : false}
label={__('Wallet Password')}
type="password"
@ -66,6 +71,7 @@ class ModalWalletUnlock extends React.PureComponent<Props> {
/>
</div>
</Form>
</section>
</Modal>
);
}

View file

@ -6,9 +6,8 @@ const ModalWelcome = props => {
const { closeModal } = props;
return (
<Modal type="custom" isOpen contentLabel="Welcome to LBRY">
<section>
<h3 className="modal__header">{__('Welcome to LBRY')}</h3>
<Modal type="custom" isOpen contentLabel="Welcome to LBRY" title={__('Welcome to LBRY')}>
<section className="card__content">
<p>
{__('Using LBRY is like dating a centaur. Totally normal up top, and')}{' '}
<em>{__('way different')}</em> {__('underneath.')}
@ -18,7 +17,7 @@ const ModalWelcome = props => {
{__('Below, LBRY is controlled by users -- you -- via blockchain and decentralization.')}
</p>
<div className="modal__buttons">
<Button button="primary" onClick={closeModal} label={__("Blockchain Centaurs? I'm In")} />
<Button button="primary" onClick={closeModal} label={__("I'm In")} />
</div>
</section>
</Modal>

Some files were not shown because too many files have changed in this diff Show more