fix(site): do not render invalid task status URI, fix GitHub new links (#20858)

Fixes #20429

site/src/pages/TaskPage/TaskStatusLink.stories.tsx

@@ -17,6 +17,12 @@ const meta: Meta<typeof TaskStatusLink> = {
 export default meta;
 type Story = StoryObj<typeof TaskStatusLink>;
 
+export const GitHubNewPR: Story = {
+	args: {
+		uri: "https://github.com/coder/coder/pull/new/fix-deleted-template-button",
+	},
+};
+
 export const GithubPRNumber: Story = {
 	args: {
 		uri: "https://github.com/org/repo/pull/1234",
@@ -29,6 +35,12 @@ export const GitHubPRNoNumber: Story = {
 	},
 };
 
+export const GitHubNewIssue: Story = {
+	args: {
+		uri: "https://github.com/coder/coder/issues/new?template=BLANK_ISSUE",
+	},
+};
+
 export const GithubIssueNumber: Story = {
 	args: {
 		uri: "https://github.com/org/repo/issues/4321",
@@ -70,3 +82,15 @@ export const Long: Story = {
 		uri: "https://dev.coder.com/this-is-a/long-url/to-test/how-the-truncation/looks",
 	},
 };
+
+export const InvalidPathNotRendered: Story = {
+	args: {
+		uri: "/path/to/foo",
+	},
+};
+
+export const InvalidRelativePathNotRendered: Story = {
+	args: {
+		uri: "path/to/foo",
+	},
+};

site/src/pages/TaskPage/TaskStatusLink.tsx

@@ -30,15 +30,21 @@ export const TaskStatusLink: FC<TaskStatusLinkProps> = ({ uri }) => {
 					switch (type) {
 						case "pull":
 							icon = <GitPullRequestArrowIcon />;
-							label = number
-								? `${org}/${repo}#${number}`
-								: `${org}/${repo} pull request`;
+							label =
+								number === "new"
+									? `${org}/${repo} open pull request`
+									: number
+										? `${org}/${repo}#${number}`
+										: `${org}/${repo} pull request`;
 							break;
 						case "issues":
 							icon = <BugIcon />;
-							label = number
-								? `${org}/${repo}#${number}`
-								: `${org}/${repo} issue`;
+							label =
+								number === "new"
+									? `${org}/${repo} create new issue`
+									: number
+										? `${org}/${repo}#${number}`
+										: `${org}/${repo} issue`;
 							break;
 						default:
 							icon = <ExternalImage src="/icon/github.svg" />;
@@ -52,6 +58,7 @@ export const TaskStatusLink: FC<TaskStatusLinkProps> = ({ uri }) => {
 		}
 	} catch (_error) {
 		// Invalid URL, probably.
+		return null;
 	}
 
 	return (