From 74ec7478401ac9b3e4b7842b9805db4418f5b5ba Mon Sep 17 00:00:00 2001 From: zeppi Date: Sat, 10 Apr 2021 23:32:17 -0400 Subject: [PATCH] review changes --- ui/component/common/card.jsx | 2 +- ui/component/livestreamLink/view.jsx | 4 +-- ui/component/publishFile/view.jsx | 48 +++++++++++++--------------- ui/component/publishForm/view.jsx | 4 +-- ui/constants/livestream.js | 3 +- ui/page/livestream/view.jsx | 4 +-- ui/scss/all.scss | 2 +- ui/scss/component/_livestream.scss | 43 ++++++++++++++----------- 8 files changed, 57 insertions(+), 53 deletions(-) diff --git a/ui/component/common/card.jsx b/ui/component/common/card.jsx index 2e8e191a8..64ce71d81 100644 --- a/ui/component/common/card.jsx +++ b/ui/component/common/card.jsx @@ -21,7 +21,7 @@ type Props = { nag?: Node, smallTitle?: boolean, onClick?: () => void, - children?: any, // not sure how this works + children?: Node, }; export default function Card(props: Props) { diff --git a/ui/component/livestreamLink/view.jsx b/ui/component/livestreamLink/view.jsx index 5515eb46c..134bc4c5f 100644 --- a/ui/component/livestreamLink/view.jsx +++ b/ui/component/livestreamLink/view.jsx @@ -1,5 +1,5 @@ // @flow -import { BITWAVE_API } from 'constants/livestream'; +import { BITWAVE_LIVE_API } from 'constants/livestream'; import React from 'react'; import Card from 'component/common/card'; import ClaimPreview from 'component/claimPreview'; @@ -35,7 +35,7 @@ export default function LivestreamLink(props: Props) { React.useEffect(() => { function fetchIsStreaming() { // $FlowFixMe Bitwave's API can handle garbage - fetch(`${BITWAVE_API}/${livestreamChannelId}`) + fetch(`${BITWAVE_LIVE_API}/${livestreamChannelId}`) .then((res) => res.json()) .then((res) => { if (res && res.success && res.data && res.data.live) { diff --git a/ui/component/publishFile/view.jsx b/ui/component/publishFile/view.jsx index 44b088b40..01e6c7c4e 100644 --- a/ui/component/publishFile/view.jsx +++ b/ui/component/publishFile/view.jsx @@ -8,7 +8,7 @@ import PostEditor from 'component/postEditor'; import FileSelector from 'component/common/file-selector'; import Button from 'component/button'; import Card from 'component/common/card'; -import { Form, FormField } from 'component/common/form'; +import { FormField } from 'component/common/form'; import Spinner from 'component/spinner'; import I18nMessage from 'component/i18nMessage'; import usePersistedState from 'effects/use-persisted-state'; @@ -98,9 +98,9 @@ function PublishFile(props: Props) { const secondsToProcess = sizeInMB / PROCESSING_MB_PER_SECOND; const fileSelectorModes = [ - { label: __('Select Replay'), actionName: SOURCE_SELECT, icon: ICONS.MENU }, + { label: __('Choose Replay'), actionName: SOURCE_SELECT, icon: ICONS.MENU }, { label: __('Upload'), actionName: SOURCE_UPLOAD, icon: ICONS.PUBLISH }, - { label: __('Not Yet'), actionName: SOURCE_NONE, icon: ICONS.REMOVE }, + { label: __('None'), actionName: SOURCE_NONE, icon: ICONS.REMOVE }, ]; const hasLivestreamData = livestreamData && Boolean(livestreamData.length); @@ -575,28 +575,26 @@ function PublishFile(props: Props) { -
- - - handlePaginateReplays(e.selected + 1)} - forcePage={currentPage - 1} - initialPage={currentPage - 1} - containerClassName="pagination" - /> - - -
+ + + handlePaginateReplays(e.selected + 1)} + forcePage={currentPage - 1} + initialPage={currentPage - 1} + containerClassName="pagination" + /> + + )} diff --git a/ui/component/publishForm/view.jsx b/ui/component/publishForm/view.jsx index 6e4f3781b..2a82e3e1a 100644 --- a/ui/component/publishForm/view.jsx +++ b/ui/component/publishForm/view.jsx @@ -28,6 +28,7 @@ import * as PUBLISH_MODES from 'constants/publish_types'; import { useHistory } from 'react-router'; import Spinner from 'component/spinner'; import { toHex } from 'util/hex'; +import { BITWAVE_REPLAY_API } from 'constants/livestream'; // @if TARGET='app' import fs from 'fs'; @@ -239,7 +240,6 @@ function PublishForm(props: Props) { hexdata: toHex(message), }) .then((data) => { - console.log('data', data); setSignedMessage(data); }) .catch((error) => { @@ -261,7 +261,7 @@ function PublishForm(props: Props) { function checkLivestreams(channelId, signature, timestamp) { // $FlowFixMe Bitwave's API can handle garbage setCheckingLivestreams(true); - fetch(`https://api.bitwave.tv/v1/replays/odysee/${channelId}?signature=${signature}&signing_ts=${timestamp}`) // claimChannelId + fetch(`${BITWAVE_REPLAY_API}/${channelId}?signature=${signature}&signing_ts=${timestamp}`) // claimChannelId .then((res) => res.json()) .then((res) => { if (!res || !res.data) { diff --git a/ui/constants/livestream.js b/ui/constants/livestream.js index fd0aca3a4..749424df9 100644 --- a/ui/constants/livestream.js +++ b/ui/constants/livestream.js @@ -1,2 +1,3 @@ export const BITWAVE_EMBED_URL = 'https://bitwave.tv/odysee'; -export const BITWAVE_API = 'https://api.bitwave.tv/v1/odysee/live'; +export const BITWAVE_LIVE_API = 'https://api.bitwave.tv/v1/odysee/live'; +export const BITWAVE_REPLAY_API = 'https://api.bitwave.tv/v1/replays/odysee'; diff --git a/ui/page/livestream/view.jsx b/ui/page/livestream/view.jsx index 0f77f9d53..5b7a7157a 100644 --- a/ui/page/livestream/view.jsx +++ b/ui/page/livestream/view.jsx @@ -1,5 +1,5 @@ // @flow -import { BITWAVE_API } from 'constants/livestream'; +import { BITWAVE_LIVE_API } from 'constants/livestream'; import React from 'react'; import Page from 'component/page'; import LivestreamLayout from 'component/livestreamLayout'; @@ -56,7 +56,7 @@ export default function LivestreamPage(props: Props) { let interval; function checkIsLive() { // $FlowFixMe Bitwave's API can handle garbage - fetch(`${BITWAVE_API}/${livestreamChannelId}`) + fetch(`${BITWAVE_LIVE_API}/${livestreamChannelId}`) .then((res) => res.json()) .then((res) => { if (!res || !res.data) { diff --git a/ui/scss/all.scss b/ui/scss/all.scss index 2aa0b0360..ea4773be4 100644 --- a/ui/scss/all.scss +++ b/ui/scss/all.scss @@ -28,7 +28,6 @@ @import 'component/form-field'; @import 'component/header'; @import 'component/icon'; -@import 'component/livestream'; @import 'component/main'; @import 'component/markdown-editor'; @import 'component/markdown-preview'; @@ -54,6 +53,7 @@ @import 'component/status-bar'; @import 'component/syntax-highlighter'; @import 'component/table'; +@import 'component/livestream'; @import 'component/tabs'; @import 'component/tooltip'; @import 'component/txo-list'; diff --git a/ui/scss/component/_livestream.scss b/ui/scss/component/_livestream.scss index d920c2fa2..79e461e28 100644 --- a/ui/scss/component/_livestream.scss +++ b/ui/scss/component/_livestream.scss @@ -208,29 +208,31 @@ .table--livestream-data { td:nth-of-type(1) { - width: 10%; + max-width: 4rem; } td:nth-of-type(2) { - width: 40%; + min-width: 8.5rem; } td:nth-of-type(3) { - width: 20%; + width: 4rem; + min-width: 9rem; } td:nth-of-type(4) { - width: 30%; + display: none; } - @media (max-width: $breakpoint-small) { + @media (min-width: $breakpoint-small) { td:nth-of-type(1) { - max-width: 10%; + max-width: 4rem; } td:nth-of-type(2) { - width: 30%; + width: 40%; } td:nth-of-type(3) { - width: 50%; + width: 5rem; } td:nth-of-type(4) { - display: none; + width: 100%; + display: table-cell; } } } @@ -240,10 +242,12 @@ width: 100%; display: flex; flex-direction: row; + overflow: hidden; } .livestream___thumb { - padding: var(--spacing-xxs); + padding: 0 var(--spacing-xxs); + object-fit: cover; } .livestream__data-row { @@ -251,23 +255,28 @@ .radio { cursor: pointer; } + &:nth-child(n) { + &.livestream__data-row--selected { + background-color: var(--color-input-toggle-bg-hover); + } + } td { - padding-right: var(--spacing-m) !important; + padding-right: var(--spacing-m); @media (max-width: $breakpoint-small) { - padding: var(--spacing-xs) !important; + padding: var(--spacing-xs); } } &:hover { td { .radio { label::before { - cursor: pointer !important; - background-color: var(--color-input-toggle-bg-hover) !important; + cursor: pointer; + background-color: var(--color-input-toggle-bg-hover); } } label { - cursor: pointer !important; + cursor: pointer; } } @@ -277,7 +286,3 @@ } } } - -.livestream__data-row--selected { - background-color: var(--color-input-bg-selected) !important; -}