diff --git a/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx b/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
index 4b604c9a85..332dd5e3ca 100644
--- a/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
+++ b/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
@@ -23,8 +23,9 @@ import {
CATEGORY_LABELS,
buildSparklinesDataForItem,
} from '../../utils';
-import { Link } from 'react-router-dom';
+import { Link, generatePath } from 'react-router-dom';
import AuditStatusIcon from '../AuditStatusIcon';
+import { viewAuditRouteRef } from '../../plugin';
const columns: TableColumn[] = [
{
@@ -98,7 +99,13 @@ export const AuditListTable: FC<{ items: Website[] }> = ({ items }) => {
return {
websiteUrl: (
- {website.url}
+
+ {website.url}
+
),
...trendlines,
lastReport: (
diff --git a/plugins/lighthouse/src/components/AuditView/index.tsx b/plugins/lighthouse/src/components/AuditView/index.tsx
index 8080fcabd0..d0e743a77f 100644
--- a/plugins/lighthouse/src/components/AuditView/index.tsx
+++ b/plugins/lighthouse/src/components/AuditView/index.tsx
@@ -14,7 +14,13 @@
* limitations under the License.
*/
import React, { useState, useEffect, ReactNode, FC } from 'react';
-import { Link, useParams, useNavigate } from 'react-router-dom';
+import {
+ Link,
+ useParams,
+ useNavigate,
+ generatePath,
+ resolvePath,
+} from 'react-router-dom';
import { useAsync } from 'react-use';
import {
makeStyles,
@@ -42,6 +48,7 @@ import { lighthouseApiRef, Website, Audit } from '../../api';
import AuditStatusIcon from '../AuditStatusIcon';
import LighthouseSupportButton from '../SupportButton';
import { formatTime } from '../../utils';
+import { viewAuditRouteRef, createAuditRouteRef } from '../../plugin';
const useStyles = makeStyles({
contentGrid: {
@@ -75,7 +82,12 @@ const AuditLinkList: FC = ({
button
component={Link}
replace
- to={`audit/${audit.id}`}
+ to={resolvePath(
+ generatePath(viewAuditRouteRef.path, {
+ id: audit.id,
+ }),
+ '../../',
+ )}
>
@@ -155,7 +167,7 @@ const ConnectedAuditView: FC<{}> = () => {
);
}
- let createAuditButtonUrl = 'create-audit';
+ let createAuditButtonUrl = createAuditRouteRef.path;
if (value?.url) {
createAuditButtonUrl += `?url=${encodeURIComponent(value.url)}`;
}