Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

feat: add View Source button for template administrators in workspace creation#18951

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
aslilac merged 5 commits intomainfromfeat/view-source-button-workspace-creation
Jul 23, 2025
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -65,7 +65,10 @@ const CreateWorkspacePage: FC = () => {
});
const permissionsQuery = useQuery({
...checkAuthorization({
checks: createWorkspaceChecks(templateQuery.data?.organization_id ?? ""),
checks: createWorkspaceChecks(
templateQuery.data?.organization_id ?? "",
templateQuery.data?.id,
),
}),
enabled: !!templateQuery.data,
});
Expand DownExpand Up@@ -208,6 +211,7 @@ const CreateWorkspacePage: FC = () => {
startPollingExternalAuth={startPollingExternalAuth}
hasAllRequiredExternalAuth={hasAllRequiredExternalAuth}
permissions={permissionsQuery.data as CreateWorkspacePermissions}
canUpdateTemplate={permissionsQuery.data?.canUpdateTemplate}
parameters={realizedParameters as TemplateVersionParameter[]}
presets={templateVersionPresetsQuery.data ?? []}
creatingWorkspace={createWorkspaceMutation.isPending}
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -79,7 +79,10 @@ const CreateWorkspacePageExperimental: FC = () => {
});
constpermissionsQuery=useQuery({
...checkAuthorization({
checks:createWorkspaceChecks(templateQuery.data?.organization_id??""),
checks:createWorkspaceChecks(
templateQuery.data?.organization_id??"",
templateQuery.data?.id,
),
}),
enabled:!!templateQuery.data,
});
Expand DownExpand Up@@ -292,6 +295,7 @@ const CreateWorkspacePageExperimental: FC = () => {
owner={owner}
setOwner={setOwner}
autofillParameters={autofillParameters}
canUpdateTemplate={permissionsQuery.data?.canUpdateTemplate}
error={
wsError||
createWorkspaceMutation.error||
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -28,6 +28,7 @@ const meta: Meta<typeof CreateWorkspacePageView> = {
mode: "form",
permissions: {
createWorkspaceForAny: true,
canUpdateTemplate: false,
},
onCancel: action("onCancel"),
},
Expand DownExpand Up@@ -382,3 +383,23 @@ export const ExternalAuthAllConnected: Story = {
],
},
};

export const WithViewSourceButton: Story = {
args: {
canUpdateTemplate: true,
versionId: "template-version-123",
template: {
...MockTemplate,
organization_name: "default",
name: "docker-template",
},
},
parameters: {
docs: {
description: {
story:
"This story shows the View Source button that appears for template administrators. The button allows quick navigation to the template editor from the workspace creation page.",
},
},
},
};
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -27,8 +27,10 @@ import { Switch } from "components/Switch/Switch";
import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete";
import { type FormikContextType, useFormik } from "formik";
import type { ExternalAuthPollingState } from "hooks/useExternalAuth";
import { ExternalLinkIcon } from "lucide-react";
import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName";
import { type FC, useCallback, useEffect, useMemo, useState } from "react";
import { Link } from "react-router-dom";
import {
getFormHelpers,
nameValidator,
Expand DownExpand Up@@ -67,6 +69,7 @@ interface CreateWorkspacePageViewProps {
presets: TypesGen.Preset[];
permissions: CreateWorkspacePermissions;
creatingWorkspace: boolean;
canUpdateTemplate?: boolean;
onCancel: () => void;
onSubmit: (
req: TypesGen.CreateWorkspaceRequest,
Expand All@@ -92,6 +95,7 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
presets = [],
permissions,
creatingWorkspace,
canUpdateTemplate,
onSubmit,
onCancel,
}) => {
Expand DownExpand Up@@ -218,9 +222,21 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
<Margins size="medium">
<PageHeader
actions={
<Button size="sm" variant="outline" onClick={onCancel}>
Cancel
</Button>
<Stack direction="row" spacing={2}>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

theactions prop is already rendered inside of a flex container that adds spacing. just use a fragment.

{canUpdateTemplate && (
<Button asChild size="sm" variant="outline">
<Link
to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}
>
<ExternalLinkIcon />
View source
</Link>
</Button>
)}
<Button size="sm" variant="outline" onClick={onCancel}>
Cancel
</Button>
</Stack>
}
>
<Stack direction="row">
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -20,6 +20,7 @@ const meta: Meta<typeof CreateWorkspacePageViewExperimental> = {
parameters: [],
permissions: {
createWorkspaceForAny: true,
canUpdateTemplate: false,
},
presets: [],
sendMessage: () => {},
Expand All@@ -38,3 +39,23 @@ export const WebsocketError: Story = {
),
},
};

export const WithViewSourceButton: Story = {
args: {
canUpdateTemplate: true,
versionId: "template-version-123",
template: {
...MockTemplate,
organization_name: "default",
name: "docker-template",
},
},
parameters: {
docs: {
description: {
story:
"This story shows the View Source button that appears for template administrators in the experimental workspace creation page. The button allows quick navigation to the template editor.",
},
},
},
};
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -27,7 +27,7 @@ import {
import{UserAutocomplete}from"components/UserAutocomplete/UserAutocomplete";
import{typeFormikContextType,useFormik}from"formik";
importtype{ExternalAuthPollingState}from"hooks/useExternalAuth";
import{ArrowLeft,CircleHelp}from"lucide-react";
import{ArrowLeft,CircleHelp,ExternalLinkIcon}from"lucide-react";
import{useSyncFormParameters}from"modules/hooks/useSyncFormParameters";
import{
Diagnostics,
Expand All@@ -44,6 +44,7 @@ import {
useRef,
useState,
}from"react";
import{LinkasRouterLink}from"react-router-dom";
import{docs}from"utils/docs";
import{nameValidator}from"utils/formUtils";
importtype{AutofillBuildParameter}from"utils/richParameters";
Expand All@@ -54,6 +55,7 @@ import type { CreateWorkspacePermissions } from "./permissions";

interfaceCreateWorkspacePageViewExperimentalProps{
autofillParameters:AutofillBuildParameter[];
canUpdateTemplate?:boolean;
creatingWorkspace:boolean;
defaultName?:string|null;
defaultOwner:TypesGen.User;
Expand DownExpand Up@@ -85,6 +87,7 @@ export const CreateWorkspacePageViewExperimental: FC<
CreateWorkspacePageViewExperimentalProps
>=({
autofillParameters,
canUpdateTemplate,
creatingWorkspace,
defaultName,
defaultOwner,
Expand DownExpand Up@@ -379,6 +382,16 @@ export const CreateWorkspacePageViewExperimental: FC<
</Badge>
)}
</span>
{canUpdateTemplate&&(
<ButtonasChildsize="sm"variant="outline">
<RouterLink
to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}
>
<ExternalLinkIcon/>
View source
</RouterLink>
</Button>
)}
</div>
<spanclassName="flex flex-row items-center gap-2">
<h1className="text-3xl font-semibold m-0">New workspace</h1>
Expand Down
18 changes: 15 additions & 3 deletionssite/src/pages/CreateWorkspacePage/permissions.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,25 @@
export const createWorkspaceChecks = (organizationId: string) =>
export const createWorkspaceChecks = (
organizationId: string,
templateId?: string,
) =>
({
createWorkspaceForAny: {
object: {
resource_type: "workspace",
resource_type: "workspace" as const,
organization_id: organizationId,
owner_id: "*",
},
action: "create",
action: "create" as const,
},
...(templateId && {
canUpdateTemplate: {
object: {
resource_type: "template" as const,
resource_id: templateId,
},
action: "update" as const,
},
}),
}) as const;

export type CreateWorkspacePermissions = Record<
Expand Down
Loading
[8]ページ先頭
©2009-2025 Movatter.jp