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

Add requested review changes

Browse source
This commit is contained in:
Raphael Wickihalder 2022-05-03 13:21:51 +02:00 committed by Thomas Zarebczan
parent ae1bed8135
commit f3fd0ba08f
11 changed files with 38 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
ui/component/claimList/view.jsx
View file

@ -60,7 +60,7 @@ type Props = {
droppableProvided?: any,
unavailableUris?: Array<string>,
showMemberBadge?: boolean,
inHistory?: boolean,
inWatchHistory?: boolean,
};
export default function ClaimList(props: Props) {
@ -101,7 +101,7 @@ export default function ClaimList(props: Props) {
droppableProvided,
unavailableUris,
showMemberBadge,
inHistory,
inWatchHistory,
} = props;
const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
@ -204,7 +204,7 @@ export default function ClaimList(props: Props) {
dragHandleProps={draggableProvided && draggableProvided.dragHandleProps}
unavailableUris={unavailableUris}
showMemberBadge={showMemberBadge}
inHistory={inHistory}
inWatchHistory={inWatchHistory}
/>
);

11
ui/component/claimPreview/view.jsx
View file

@ -97,7 +97,7 @@ type Props = {
dragHandleProps?: any,
unavailableUris?: Array<string>,
showMemberBadge?: boolean,
inHistory?: boolean,
inWatchHistory?: boolean,
};
const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
@ -163,7 +163,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
dragHandleProps,
unavailableUris,
showMemberBadge,
inHistory,
inWatchHistory,
} = props;
const isMobile = useIsMobile();
@ -214,7 +214,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
? claim.permanent_url || claim.canonical_url
: undefined;
const repostedContentUri = claim && (claim.reposted_claim ? claim.reposted_claim.permanent_url : claim.permanent_url);
const [watchHistory, setHistory] = usePersistedState('watch-history', []);
const [watchHistory, setWatchHistory] = usePersistedState('watch-history', []);
// Get channel title ( use name as fallback )
let channelTitle = null;
@ -285,7 +285,6 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
function handleOnClick(e) {
if (onClick) {
console.log('click: ', e);
onClick(e, claim, indexInContainer);
}
@ -301,7 +300,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
e.stopPropagation();
if (watchHistory.find((entry) => entry === uri)) {
watchHistory.splice(watchHistory.indexOf(uri), 1);
setHistory(watchHistory);
setWatchHistory(watchHistory);
}
}
@ -499,7 +498,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
)}
</div>
</div>
{inHistory && (
{inWatchHistory && (
<div onClick={(e) => removeFromHistory(e, uri)} className="claim-preview__history-remove">
<Icon icon={ICONS.REMOVE} />
</div>

2
ui/component/common/icon-custom.jsx
View file

@ -3297,7 +3297,7 @@ export const icons = {
</g>
</svg>
),
[ICONS.WATCHHISTORY]: buildIcon(
[ICONS.WATCH_HISTORY]: buildIcon(
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M0.6,11.8c0-6,5-11,11-11 M9.6,7.2v9.5l6.9-4.7L9.6,7.2z M-2.1,9.5l2.9,2.9l3.2-2.7 M11.4,23.2 v-0.9 M5.6,21.5L6,20.6 M2.1,16.4l-0.8,0.4 M17,20.8l0.5,0.8 M20.9,16.7l0.8,0.5 M23.1,11l-0.9,0.1 M21,5.2l-0.7,0.5 M16.2,1.2 L15.8,2" />
</svg>

4
ui/component/router/view.jsx
View file

@ -70,7 +70,7 @@ const LibraryPage = lazyImport(() => import('page/library' /* webpackChunkName:
const ListBlockedPage = lazyImport(() => import('page/listBlocked' /* webpackChunkName: "listBlocked" */));
const ListsPage = lazyImport(() => import('page/lists' /* webpackChunkName: "lists" */));
const PlaylistsPage = lazyImport(() => import('page/playlists' /* webpackChunkName: "lists" */));
const HistoryPage = lazyImport(() => import('page/history' /* webpackChunkName: "history" */));
const WatchHistoryPage = lazyImport(() => import('page/watchHistory' /* webpackChunkName: "history" */));
const LiveStreamSetupPage = lazyImport(() => import('page/livestreamSetup' /* webpackChunkName: "livestreamSetup" */));
const LivestreamCurrentPage = lazyImport(() =>
import('page/livestreamCurrent' /* webpackChunkName: "livestreamCurrent" */)
@ -363,7 +363,7 @@ function AppRouter(props: Props) {
<PrivateRoute {...props} path={`/$/${PAGES.LIBRARY}`} component={LibraryPage} />
<PrivateRoute {...props} path={`/$/${PAGES.LISTS}`} component={ListsPage} />
<PrivateRoute {...props} path={`/$/${PAGES.PLAYLISTS}`} component={PlaylistsPage} />
<PrivateRoute {...props} path={`/$/${PAGES.HISTORY}`} component={HistoryPage} />
<PrivateRoute {...props} path={`/$/${PAGES.WATCH_HISTORY}`} component={WatchHistoryPage} />
<PrivateRoute {...props} path={`/$/${PAGES.TAGS_FOLLOWING_MANAGE}`} component={TagsFollowingManagePage} />
<PrivateRoute {...props} path={`/$/${PAGES.SETTINGS_BLOCKED_MUTED}`} component={ListBlockedPage} />
<PrivateRoute {...props} path={`/$/${PAGES.SETTINGS_CREATOR}`} component={SettingsCreatorPage} />

10
ui/component/sideNavigation/view.jsx
View file

@ -87,10 +87,10 @@ const PLAYLISTS: SideNavLink = {
hideForUnauth: true,
};
const HISTORY: SideNavLink = {
title: 'History',
link: `/$/${PAGES.HISTORY}`,
icon: ICONS.WATCHHISTORY,
const WATCH_HISTORY: SideNavLink = {
title: 'Watch History',
link: `/$/${PAGES.WATCH_HISTORY}`,
icon: ICONS.WATCH_HISTORY,
hideForUnauth: true,
};
@ -536,7 +536,7 @@ function SideNavigation(props: Props) {
{!showMicroMenu && getLink(WATCH_LATER)}
{!showMicroMenu && getLink(FAVORITES)}
{getLink(PLAYLISTS)}
{getLink(HISTORY)}
{!showMicroMenu && getLink(WATCH_HISTORY)}
</ul>
<ul

19
ui/component/viewers/videoViewer/view.jsx
View file

@ -152,19 +152,20 @@ function VideoViewer(props: Props) {
const isFirstRender = React.useRef(true);
const playerRef = React.useRef(null);
const [history, setHistory] = usePersistedState('watch-history', []);
const [watchHistory, setWatchHistory] = usePersistedState('watch-history', []);
React.useEffect(() => {
if (!history[0] || !history[0].indexOf(claim.permanent_url) !== -1) {
if (!history || !history.length) {
setHistory([claim.permanent_url]);
if (!watchHistory[0] || !watchHistory[0].indexOf(claim.permanent_url) !== -1) {
if (!watchHistory || !watchHistory.length) {
setWatchHistory([claim.permanent_url]);
} else {
if (history.find((entry) => entry === claim.permanent_url)) {
history.splice(history.indexOf(claim.permanent_url), 1);
history.unshift(claim.permanent_url);
let newWatchHistory = watchHistory;
if (newWatchHistory.find((entry) => entry === claim.permanent_url)) {
newWatchHistory.splice(newWatchHistory.indexOf(claim.permanent_url), 1);
newWatchHistory.unshift(claim.permanent_url);
} else {
history.unshift(claim.permanent_url);
newWatchHistory.unshift(claim.permanent_url);
}
setHistory(history);
setWatchHistory(newWatchHistory);
}
}
}, [isPlaying]);

2
ui/constants/icons.js
View file

@ -25,7 +25,7 @@ export const FEEDBACK = 'MessageSquare';
export const SEARCH = 'Search';
export const CHANNEL = 'AtSign';
export const REFRESH = 'RefreshCw';
export const WATCHHISTORY = 'WatchHistory';
export const WATCH_HISTORY = 'WatchHistory';
export const HOME = 'Home';
export const OVERVIEW = 'Activity';
export const WALLET = 'List';

2
ui/constants/pages.js
View file

@ -34,7 +34,7 @@ exports.HELP = 'help';
exports.LIBRARY = 'library';
exports.LISTS = 'lists';
exports.PLAYLISTS = 'playlists';
exports.HISTORY = 'history';
exports.WATCH_HISTORY = 'watchhistory';
exports.INVITE = 'invite';
exports.DEPRECATED__DOWNLOADED = 'downloaded';
exports.DEPRECATED__PUBLISH = 'publish';

3
ui/page/collection/view.jsx
View file

@ -64,9 +64,6 @@ export default function CollectionPage(props: Props) {
deleteCollection,
} = props;
console.log('collection: ', props.collection);
console.log('collectionUrls: ', props.collectionUrls);
const {
replace,
location: { search },

4
ui/page/history/index.js → ui/page/watchHistory/index.js
View file

@ -1,7 +1,7 @@
import { connect } from 'react-redux';
import { withRouter } from 'react-router-dom';
import HistoryPage from './view';
import WatchHistoryPage from './view';
import {
selectTitleForUri,
selectClaimIsMine,
@ -56,4 +56,4 @@ const perform = (dispatch) => ({
editCollection: (id, params) => dispatch(doCollectionEdit(id, params)),
});
export default withRouter(connect(select, perform)(HistoryPage));
export default withRouter(connect(select, perform)(WatchHistoryPage));

24
ui/page/history/view.jsx → ui/page/watchHistory/view.jsx
View file

@ -8,11 +8,9 @@ import Icon from 'component/common/icon';
import * as ICONS from 'constants/icons';
import { YRBL_SAD_IMG_URL } from 'config';
import Tooltip from 'component/common/tooltip';
import usePersistedState from 'effects/use-persisted-state';
export const PAGE_VIEW_QUERY = 'view';
// export const EDIT_PAGE = 'edit';
type Props = {
collectionId: string,
@ -21,24 +19,18 @@ type Props = {
thumbnail: string,
collectionUrls: Array<string>,
isResolvingCollection: boolean,
// isMyClaim: boolean,
// isMyCollection: boolean,
// claimIsPending: boolean,
// collectionHasEdits: boolean,
// deleteCollection: (string, string) => void,
// editCollection: (string, CollectionEditParams) => void,
fetchCollectionItems: (string, () => void) => void,
resolveUris: (string) => void,
user: ?User,
};
export default function HistoryPage(props: Props) {
export default function WatchHistoryPage(props: Props) {
const { collectionId } = props;
const [history, setHistory] = usePersistedState('watch-history', []);
const [watchHistory, setWatchHistory] = usePersistedState('watch-history', []);
const [unavailableUris] = React.useState([]);
function clearHistory() {
setHistory([]);
setWatchHistory([]);
}
return (
@ -46,7 +38,7 @@ export default function HistoryPage(props: Props) {
<div className={classnames('section card-stack')}>
<div className="claim-list__header">
<h1 className="card__title">
<Icon icon={ICONS.WATCHHISTORY} style={{ marginRight: 'var(--spacing-s)' }} />
<Icon icon={ICONS.WATCH_HISTORY} style={{ marginRight: 'var(--spacing-s)' }} />
{__('Watch History')}
<Tooltip title={__('Currently, your watch history is only saved locally.')}>
<Button className="icon--help" icon={ICONS.HELP} iconSize={14} />
@ -54,7 +46,7 @@ export default function HistoryPage(props: Props) {
</h1>
<div className="claim-list__alt-controls--wrap">
{history.length > 0 && (
{watchHistory.length > 0 && (
<Button
title={__('Clear History')}
button="primary"
@ -64,10 +56,10 @@ export default function HistoryPage(props: Props) {
)}
</div>
</div>
{history.length > 0 && (
<ClaimList uris={history} collectionId={collectionId} unavailableUris={unavailableUris} inHistory />
{watchHistory.length > 0 && (
<ClaimList uris={watchHistory} collectionId={collectionId} unavailableUris={unavailableUris} inWatchHistory />
)}
{history.length === 0 && (
{watchHistory.length === 0 && (
<div style={{ textAlign: 'center' }}>
<img src={YRBL_SAD_IMG_URL} />
<h2 className="main--empty empty" style={{ marginTop: '0' }}>