diff --git a/app/components/network/LogList.tsx b/app/components/network/LogList.tsx index 642d7d6c..82ab6c36 100644 --- a/app/components/network/LogList.tsx +++ b/app/components/network/LogList.tsx @@ -1,18 +1,18 @@ import React from 'react' -import { Action } from 'redux' -import { QriRef } from '../../models/qriRef' +import { QriRef, refStringFromQriRef } from '../../models/qriRef' import { VersionInfo } from '../../models/store' import { FetchOptions } from '../../store/api' import { BACKEND_URL } from '../../constants' import HistoryListItem from '../item/HistoryListItem' +import { RouteComponentProps, withRouter } from 'react-router-dom' -export interface LogListProps { +export interface LogListProps extends RouteComponentProps{ qriRef: QriRef } -const LogList: React.FC = ({ qriRef }) => { +const LogList: React.FC = ({ qriRef, history }) => { const [data, setData] = React.useState([]) const [error, setError] = React.useState('') @@ -34,6 +34,12 @@ const LogList: React.FC = ({ qriRef }) => { fetchLogs() }, [qriRef.username, qriRef.name]) + const handleOnClick = (item: VersionInfo) => { + return () => { + history.push(`/network/${refStringFromQriRef({ location: '', username: item.username, name: item.name, path: item.path })}`) + } + } + return (
= ({ qriRef }) => { > { data.map((item, i) => { + const selected = qriRef.path ? qriRef.path === item.path : i === 0 return ( = ({ qriRef }) => { id={`HEAD-${i + 1}`} first={i === 0} last={i === data.length - 1} - selected={false} - onClick={(s: string): Action => { - alert(`you clicked a commit: ${s}`) - return { type: '' } - }} + selected={selected} + onClick={handleOnClick(item)} /> ) }) @@ -61,4 +65,4 @@ const LogList: React.FC = ({ qriRef }) => { ) } -export default LogList +export default withRouter(LogList) diff --git a/app/models/qriRef.ts b/app/models/qriRef.ts index d4c90d9c..b46d7620 100644 --- a/app/models/qriRef.ts +++ b/app/models/qriRef.ts @@ -57,7 +57,14 @@ export function qriRefFromRoute (p: RouteComponentProps): QriRef { username: p.match.params.username, name: p.match.params.name, - path: p.match.params.path, + path: p.match.params.path ? '/ipfs/' + p.match.params.path : undefined, selector: p.match.params.selector } } + +// refStringFromQriRef takes a qriRef and turns it into a ref string +export function refStringFromQriRef (qriRef: QriRef): string { + let route = `${qriRef.username}/${qriRef.name}` + if (qriRef.path) route += `/at${qriRef.path}` + return route +} diff --git a/app/routes.tsx b/app/routes.tsx index f53640e8..5560e64b 100644 --- a/app/routes.tsx +++ b/app/routes.tsx @@ -54,6 +54,11 @@ export default function Routes (props: any) { }} /> {/* App Sections */} + { __BUILD__.ENABLE_NETWORK_SECTION && + { + return sectionElement('network', ) + }} /> + } { __BUILD__.ENABLE_NETWORK_SECTION && { return sectionElement('network', )