Skip to content

Commit

Permalink
refactor: dataset route refactor, use hash for selected component
Browse files Browse the repository at this point in the history
  • Loading branch information
chriswhong committed Oct 13, 2021
1 parent ff9c945 commit 86e7824
Show file tree
Hide file tree
Showing 23 changed files with 145 additions and 114 deletions.
7 changes: 3 additions & 4 deletions e2e-tests/golden_path.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -82,15 +82,15 @@ test.describe.serial('Golden path', () => {
});

test('History update check', async () => {
await page.goto(APP_URL + `/ds/${USERNAME}/${workflowRandomName}/body`);
await page.goto(APP_URL + `/${USERNAME}/${workflowRandomName}/body`);
const versionInfoText = await page.locator('.commit_summary_header_container .dataset_commit_info_text');
await expect(versionInfoText).toHaveText('created dataset')
const versionSelector = await page.locator('#dataset_commit_list_versions_text');
await expect(versionSelector).toHaveText('1 version');
});

test('Checking if trigger is fine on workflow', async () => {
await page.goto(APP_URL + `/ds/${USERNAME}/${workflowRandomName}/workflow`);
await page.goto(APP_URL + `/${USERNAME}/${workflowRandomName}/workflow`);
const selector = await page.locator('#cron_trigger_interval_text');
await expect(selector).toContainText('Every day');
});
Expand All @@ -112,11 +112,10 @@ test.describe.serial('Golden path', () => {
});

test('History second version update check', async () => {
await page.goto(APP_URL + `/ds/${USERNAME}/${workflowRandomName}/body`);
await page.goto(APP_URL + `/${USERNAME}/${workflowRandomName}/body`);
const versionSelector = await page.locator('#dataset_commit_list_versions_text');
const versionInfoText = await page.locator('.commit_summary_header_container .dataset_commit_info_text');
await expect(versionSelector).toHaveText('2 versions');
await expect(versionInfoText).toContainText('updated transform and body')
});
});

10 changes: 5 additions & 5 deletions e2e/e2e.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ test('happy path', async () => {
await page.waitForSelector("#new-dataset-button")

await page.click('#new-dataset-button')
expect(page.url()).toContain('/ds/new')
expect(page.url()).toContain('/new')

await page.click('#CSVDownload')
await page.waitForSelector('#workflow')
Expand Down Expand Up @@ -95,7 +95,7 @@ test('happy path', async () => {
await page.keyboard.type('\nbadcode',{delay: 20})
await page.click('#dry-run')
await page.waitForSelector('#failed')

const downloadOutput = await page.$('#download-cell .output')
.then(async el => {
return await page.evaluate((el: HTMLElement) => {
Expand All @@ -112,7 +112,7 @@ test('happy path', async () => {
await page.click('#dry-run')
await page.waitForSelector('#succeeded')
await page.waitForSelector('#dataset-preview')

// TODO (ramfox): when we get this functionality up and running, we can comment
// these tests back in
// await page.click('#select-schedule')
Expand Down Expand Up @@ -151,7 +151,7 @@ test('happy path', async () => {
// await workflowItemEl.click()
// await page.waitForSelector('#setup-cell')
// await page.click('#setup-cell .monaco-editor')
// await page.keyboard.type('badcode',{delay: 20})
// await page.keyboard.type('badcode',{delay: 20})
// await page.click('#run-and-save')
// await page.click('#menu')
// await page.click('#back-to-collection')
Expand Down Expand Up @@ -422,4 +422,4 @@ test('happy path', async () => {
// })

// await page.click('.popover-body #download-full')
// })
// })
2 changes: 1 addition & 1 deletion src/features/activityFeed/ActivityList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ const ActivityList: React.FC<ActivityListProps> = ({
const { username, name } = row
return (
<div className='hover:text-qrilightblue hover:underline'>
<Link to={`/ds/${username}/${name}`}>{username}/{name}</Link>
<Link to={`/${username}/${name}`}>{username}/{name}</Link>
</div>
)
}
Expand Down
4 changes: 2 additions & 2 deletions src/features/collection/CollectionTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import Icon from '../../chrome/Icon'
import RelativeTimestamp from '../../chrome/RelativeTimestamp'
import UsernameWithIcon from '../../chrome/UsernameWithIcon'
import DropdownMenu from '../../chrome/DropdownMenu'
import { pathToDatasetPreview } from '../dataset/state/datasetPaths'
import { pathToDatasetHeadPreview } from '../dataset/state/datasetPaths'
import RunStatusBadge from '../run/RunStatusBadge'
import { VersionInfo } from '../../qri/versionInfo'
import ManualTriggerButton from '../workflow/ManualTriggerButton'
Expand Down Expand Up @@ -116,7 +116,7 @@ const CollectionTable: React.FC<CollectionTableProps> = ({
</div>
<div className='truncate'>
<div className='mb-1'>
<Link to={pathToDatasetPreview(row)}>
<Link to={pathToDatasetHeadPreview(row, { ignorePath: true })}>
<UsernameWithIcon username={`${row.username}/${row.name}`} className='text-sm font-medium text-black ' />
</Link>
</div>
Expand Down
9 changes: 5 additions & 4 deletions src/features/commits/DatasetCommit.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Link } from 'react-router-dom'
import { Link, useLocation } from 'react-router-dom'
import classNames from 'classnames'

import { LogItem } from '../../qri/log'
import { newQriRef } from '../../qri/ref'
import { newQriRef, refParamsFromLocation } from '../../qri/ref'
import { NewDataset } from '../../qri/dataset'
import { pathToDatasetViewer } from '../dataset/state/datasetPaths'
import { pathToDatasetHistory } from '../dataset/state/datasetPaths'
import DatasetCommitInfo from '../../chrome/DatasetCommitInfo'

export interface DatasetCommitProps {
Expand All @@ -19,6 +19,7 @@ const DatasetCommit: React.FC<DatasetCommitProps> = ({
active = false,
isLink = true
}) => {
const location = useLocation()
// create a Dataset to pass into DatasetCommitInfo
const dataset = NewDataset({
username: logItem.username,
Expand All @@ -39,7 +40,7 @@ const DatasetCommit: React.FC<DatasetCommitProps> = ({
return (
<Link
className={containerClassNames}
to={pathToDatasetViewer(newQriRef(logItem))}
to={pathToDatasetHistory(newQriRef(refParamsFromLocation(logItem, location)))}
style={{ fontSize: 11 }}
>
{content}
Expand Down
2 changes: 1 addition & 1 deletion src/features/dashboard/Dashboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const Dashboard: React.FC<any> = () => {
<header className='mb-8 flex'>
<h1 className='text-2xl font-extrabold w-1/2'>Dashboard</h1>
<div className='w-1/2 text-right'>
<Link to='/ds/new'>
<Link to='/new'>
<Button>
<Icon icon='plusCircle' className='mr-2' size='md'/> New Dataset
</Button>
Expand Down
8 changes: 4 additions & 4 deletions src/features/dataset/DatasetNavSidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,10 @@ import NewDatasetButton from '../../chrome/NewDatasetButton'
import Icon from '../../chrome/Icon'
import {
pathToWorkflowEditor,
pathToDatasetViewer,
pathToDatasetHistory,
pathToDatasetIssues,
pathToDatasetPreview,
pathToActivityFeed,
pathToDatasetRuns,
} from './state/datasetPaths'

import { selectNavExpanded } from '../app/state/appState'
Expand Down Expand Up @@ -91,7 +91,7 @@ const DatasetNavSidebar: React.FC<DatasetNavSidebarProps> = ({ qriRef }) => {
id='components'
icon='history'
label='History'
to={pathToDatasetViewer(qriRef)}
to={pathToDatasetHistory(qriRef)}
expanded={expanded}
number={versionCount}
tooltip={
Expand Down Expand Up @@ -119,7 +119,7 @@ const DatasetNavSidebar: React.FC<DatasetNavSidebarProps> = ({ qriRef }) => {
id='activity-feed'
icon='clock'
label='Run Log'
to={pathToActivityFeed(qriRef.username, qriRef.name)}
to={pathToDatasetRuns(qriRef.username, qriRef.name)}
expanded={expanded}
number={logCount}
tooltip={
Expand Down
50 changes: 23 additions & 27 deletions src/features/dataset/DatasetRoutes.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
// DatasetPreviewPage fetches the other necessary parts of the preview (body + readme)

import React, {useEffect} from 'react'
import { Redirect, Route, Switch, useParams, useRouteMatch } from 'react-router'
import { Route, Switch, useParams } from 'react-router'
import { useDispatch } from "react-redux";

import WorkflowPage from '../workflow/WorkflowPage'
Expand All @@ -20,7 +20,6 @@ import DatasetWrapper from '../dsComponents/DatasetWrapper'
import { loadHeader } from "./state/datasetActions";

const DatasetRoutes: React.FC<{}> = () => {
const { url } = useRouteMatch()
// TODO(b5): this qriRef is missing all params after /:username/:name b/c
// params are dictated by the route that loaded this component.
// This ref can only be used to load HEAD because DatasetRoutes defines
Expand All @@ -37,49 +36,46 @@ const DatasetRoutes: React.FC<{}> = () => {
return (
<DatasetWrapper>
<Switch>
<Route path='/ds/:username/:name' exact>
<Redirect to={`${url}/preview`} />
{/* dataset preview */}
<Route path='/:username/:name' exact>
<DatasetPreviewPage qriRef={qriRef} />
</Route>

<Route path='/ds/:username/:name/workflow'>
<WorkflowPage qriRef={qriRef} />
<Route path='/:username/:name/at/:fs/:hash' exact>
<DatasetPreviewPage qriRef={qriRef} />
</Route>

<Route path='/ds/:username/:name/history'>
<DatasetActivityFeed qriRef={qriRef} />
{/* dataset history */}
<Route path='/:username/:name/history'>
<DatasetComponents />
</Route>

<Route path='/ds/:username/:name/preview' exact>
<DatasetPreviewPage qriRef={qriRef} />
<Route path='/:username/:name/at/:fs/:hash/history'>
<DatasetComponents />
</Route>

{/* dataset workflow */}
<Route path='/:username/:name/workflow'>
<WorkflowPage qriRef={qriRef} />
</Route>

{/* dataset runs */}
<Route path='/:username/:name/runs'>
<DatasetActivityFeed qriRef={qriRef} />
</Route>

{process.env.REACT_APP_FEATURE_WIREFRAMES &&
<Route path='/ds/:username/:name/issues'>
<Route path='/:username/:name/issues'>
<DatasetIssues qriRef={qriRef} />
</Route>
}

{process.env.REACT_APP_FEATURE_WIREFRAMES &&
<Route path='/ds/:username/:name/edit'>
<Route path='/:username/:name/edit'>
<DatasetEditor />
</Route>
}

<Route path='/ds/:username/:name/at/:fs/:hash/components'>
<Redirect to={`/ds/${qriRef.username}/${qriRef.name}/at/${qriRef.path}/body`} />
</Route>

<Route path='/ds/:username/:name/at/:fs/:hash/:component'>
<DatasetComponents />
</Route>

<Route path='/ds/:username/:name/components'>
<Redirect to={`/ds/${qriRef.username}/${qriRef.name}/body`} />
</Route>

<Route path='/ds/:username/:name/:component'>
<DatasetComponents />
</Route>
</Switch>
</DatasetWrapper>
)
Expand Down
30 changes: 20 additions & 10 deletions src/features/dataset/state/datasetPaths.ts
Original file line number Diff line number Diff line change
@@ -1,31 +1,41 @@
import { QriRef } from "../../../qri/ref";

export function pathToDatasetIssues(ref: QriRef): string {
return `/ds/${ref.username}/${ref.name}/issues`
return `/${ref.username}/${ref.name}/issues`
}

export function pathToDatasetHeadPreview(ref: QriRef): string {
return `/${ref.username}/${ref.name}`
}

export function pathToDatasetPreview(ref: QriRef): string {
return `/ds/${ref.username}/${ref.name}/preview`
let urlPath = `/${ref.username}/${ref.name}`
if (ref.path) {
urlPath += `/at${ref.path}`
}

return urlPath
}

export function pathToDatasetViewer(ref: QriRef): string {
let urlPath = `/ds/${ref.username}/${ref.name}`
export function pathToDatasetHistory(ref: QriRef): string {
let urlPath = `/${ref.username}/${ref.name}`
if (ref.path) {
urlPath += `/at${ref.path}`
}
urlPath += ref.component ? `/${ref.component}` : "/body"
urlPath += '/history'
urlPath += ref.component ? `#${ref.component}` : "#body"

return urlPath
}

export function pathToDatasetEditor(ref: QriRef): string {
return `/ds/${ref.username}/${ref.name}/edit`
return `/${ref.username}/${ref.name}/edit`
}

export function pathToWorkflowEditor(username: string, name: string): string {
return `/ds/${username}/${name}/workflow`
return `/${username}/${name}/workflow`
}

export function pathToActivityFeed(username: string, name:string): string {
return `/ds/${username}/${name}/history`
}
export function pathToDatasetRuns(username: string, name:string): string {
return `/${username}/${name}/runs`
}
Loading

0 comments on commit 86e7824

Please sign in to comment.