Skip to content

Commit 5c1c557

Browse files
authored
feat: drop legacy CLI templates (#4867)
Here dropped vanilla and legacy vercel templates. Replaced vanilla with docker in publish dialog. <img width="360" alt="Screenshot 2025-02-13 at 18 34 53" src="https://github.com/user-attachments/assets/c84cdae1-d1f8-4a91-b03c-1e13e95bcbf2" />
1 parent 5ae7ea6 commit 5c1c557

File tree

4 files changed

+150
-157
lines changed

4 files changed

+150
-157
lines changed

apps/builder/app/builder/features/topbar/publish.tsx

Lines changed: 150 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@ import {
5656
import { AddDomain } from "./add-domain";
5757
import { humanizeString } from "~/shared/string-utils";
5858
import { trpcClient, nativeClient } from "~/shared/trpc/trpc-client";
59-
import { isFeatureEnabled } from "@webstudio-is/feature-flags";
6059
import type { Templates } from "@webstudio-is/sdk";
6160
import DomainCheckbox, { domainToPublishName } from "./domain-checkbox";
6261
import { CopyToClipboard } from "~/builder/shared/copy-to-clipboard";
@@ -641,30 +640,38 @@ const Content = (props: {
641640
);
642641
};
643642

644-
const deployTargets = {
645-
vanilla: {
643+
type DeployTarget = {
644+
docs?: string;
645+
command?: string;
646+
ssgTemplates?: Templates[];
647+
};
648+
649+
const deployTargets: Record<string, DeployTarget> = {
650+
docker: {
651+
docs: "https://docs.docker.com",
646652
command: `
647-
npm install
648-
npm run dev
653+
docker build -t my-image .
654+
docker run my-image
649655
`,
650-
docs: "https://remix.run/",
656+
},
657+
static: {
651658
ssgTemplates: ["ssg"],
652659
},
653660
vercel: {
654-
command: "npx vercel@latest",
655661
docs: "https://vercel.com/docs/cli",
662+
command: "npx vercel@latest",
656663
ssgTemplates: ["ssg-vercel"],
657664
},
658665
netlify: {
666+
docs: "https://docs.netlify.com/cli/get-started/",
659667
command: `
660668
npx netlify-cli@latest login
661669
npx netlify-cli sites:create
662670
npx netlify-cli build
663671
npx netlify-cli deploy`,
664-
docs: "https://docs.netlify.com/cli/get-started/",
665672
ssgTemplates: ["ssg-netlify"],
666673
},
667-
} as const;
674+
};
668675

669676
type DeployTargets = keyof typeof deployTargets;
670677

@@ -673,7 +680,7 @@ const isDeployTargets = (value: string): value is DeployTargets =>
673680

674681
const ExportContent = (props: { projectId: Project["id"] }) => {
675682
const npxCommand = "npx webstudio@latest";
676-
const [deployTarget, setDeployTarget] = useState<DeployTargets>("vanilla");
683+
const [deployTarget, setDeployTarget] = useState<DeployTargets>("docker");
677684

678685
return (
679686
<Grid columns={1} gap={3} css={{ padding: theme.panel.padding }}>
@@ -698,152 +705,151 @@ const ExportContent = (props: { projectId: Project["id"] }) => {
698705
</Grid>
699706
</Grid>
700707

701-
<Grid columns={1} gap={1}>
702-
{isFeatureEnabled("staticExport") && (
703-
<>
704-
<PublishStatic
705-
projectId={props.projectId}
706-
templates={deployTargets[deployTarget].ssgTemplates}
707-
/>
708-
<div />
709-
<Text color="subtle">
710-
Learn about deploying static sites{" "}
711-
<Link
712-
variant="inherit"
713-
color="inherit"
714-
href="https://wstd.us/ssg"
715-
target="_blank"
716-
rel="noreferrer"
717-
>
718-
here
719-
</Link>
720-
</Text>
721-
722-
<div />
723-
<div />
724-
<Grid
725-
gap={2}
726-
align={"center"}
727-
css={{
728-
gridTemplateColumns: `1fr auto 1fr`,
729-
}}
730-
>
731-
<Separator css={{ alignSelf: "unset" }} />
732-
<Text color="main">CLI</Text>
733-
<Separator css={{ alignSelf: "unset" }} />
734-
</Grid>
735-
</>
736-
)}
737-
738-
<Text color="main" variant="labelsTitleCase">
739-
Step 1
740-
</Text>
741-
<Text color="subtle">
742-
Download and install Node v20+ from{" "}
743-
<Link
744-
variant="inherit"
745-
color="inherit"
746-
href="https://nodejs.org/"
747-
target="_blank"
748-
rel="noreferrer"
749-
>
750-
nodejs.org
751-
</Link>{" "}
752-
or with{" "}
753-
<Link
754-
variant="inherit"
755-
color="inherit"
756-
href="https://nodejs.org/en/download/package-manager"
757-
target="_blank"
758-
rel="noreferrer"
759-
>
760-
a package manager
761-
</Link>
762-
.
763-
</Text>
764-
</Grid>
765-
766-
<Grid columns={1} gap={2}>
708+
{deployTargets[deployTarget].ssgTemplates && (
767709
<Grid columns={1} gap={1}>
768-
<Text color="main" variant="labelsTitleCase">
769-
Step 2
770-
</Text>
771-
<Text color="subtle">
772-
Run this command in your Terminal to install Webstudio CLI and sync
773-
your project.
774-
</Text>
775-
</Grid>
776-
777-
<Flex gap={2}>
778-
<InputField
779-
css={{ flex: 1 }}
780-
text="mono"
781-
readOnly
782-
value={npxCommand}
710+
<PublishStatic
711+
projectId={props.projectId}
712+
templates={deployTargets[deployTarget].ssgTemplates}
783713
/>
784-
785-
<CopyToClipboard text={npxCommand}>
786-
<Button type="button" color="neutral" prefix={<CopyIcon />}>
787-
Copy
788-
</Button>
789-
</CopyToClipboard>
790-
</Flex>
791-
</Grid>
792-
<Grid columns={1} gap={2}>
793-
<Grid columns={1} gap={1}>
794-
<Text color="main" variant="labelsTitleCase">
795-
Step 3
796-
</Text>
714+
<div />
797715
<Text color="subtle">
798-
Run this command to publish to{" "}
716+
Learn about deploying static sites{" "}
799717
<Link
800718
variant="inherit"
801719
color="inherit"
802-
href={deployTargets[deployTarget].docs}
720+
href="https://wstd.us/ssg"
803721
target="_blank"
804722
rel="noreferrer"
805723
>
806-
{humanizeString(deployTarget)}
807-
</Link>{" "}
724+
here
725+
</Link>
808726
</Text>
809727
</Grid>
810-
811-
<Flex gap={2} align="end">
812-
<TextArea
813-
css={{ flex: 1 }}
814-
variant="mono"
815-
readOnly
816-
value={stripIndent(deployTargets[deployTarget].command)
817-
.trimStart()
818-
.replace(/ +$/, "")}
819-
/>
820-
821-
<CopyToClipboard text={deployTargets[deployTarget].command}>
822-
<Button
823-
type="button"
824-
css={{ flexShrink: 0 }}
825-
color="neutral"
826-
prefix={<CopyIcon />}
827-
>
828-
Copy
829-
</Button>
830-
</CopyToClipboard>
831-
</Flex>
832-
</Grid>
833-
<Grid columns={1} gap={1}>
834-
<Text color="subtle">
835-
Read the detailed documentation{" "}
836-
<Link
837-
variant="inherit"
838-
color="inherit"
839-
href="https://wstd.us/cli"
840-
target="_blank"
841-
rel="noreferrer"
728+
)}
729+
730+
{deployTargets[deployTarget].command && (
731+
<Grid columns={1} gap={2}>
732+
<Grid
733+
gap={2}
734+
align={"center"}
735+
css={{
736+
gridTemplateColumns: `1fr auto 1fr`,
737+
}}
842738
>
843-
here
844-
</Link>
845-
</Text>
846-
</Grid>
739+
<Separator css={{ alignSelf: "unset" }} />
740+
<Text color="main">CLI</Text>
741+
<Separator css={{ alignSelf: "unset" }} />
742+
</Grid>
743+
<Grid columns={1} gap={1}>
744+
<Text color="main" variant="labelsTitleCase">
745+
Step 1
746+
</Text>
747+
<Text color="subtle">
748+
Download and install Node v20+ from{" "}
749+
<Link
750+
variant="inherit"
751+
color="inherit"
752+
href="https://nodejs.org/"
753+
target="_blank"
754+
rel="noreferrer"
755+
>
756+
nodejs.org
757+
</Link>{" "}
758+
or with{" "}
759+
<Link
760+
variant="inherit"
761+
color="inherit"
762+
href="https://nodejs.org/en/download/package-manager"
763+
target="_blank"
764+
rel="noreferrer"
765+
>
766+
a package manager
767+
</Link>
768+
.
769+
</Text>
770+
</Grid>
771+
772+
<Grid columns={1} gap={2}>
773+
<Grid columns={1} gap={1}>
774+
<Text color="main" variant="labelsTitleCase">
775+
Step 2
776+
</Text>
777+
<Text color="subtle">
778+
Run this command in your Terminal to install Webstudio CLI and
779+
sync your project.
780+
</Text>
781+
</Grid>
782+
<Flex gap={2}>
783+
<InputField
784+
css={{ flex: 1 }}
785+
text="mono"
786+
readOnly
787+
value={npxCommand}
788+
/>
789+
<CopyToClipboard text={npxCommand}>
790+
<Button type="button" color="neutral" prefix={<CopyIcon />}>
791+
Copy
792+
</Button>
793+
</CopyToClipboard>
794+
</Flex>
795+
</Grid>
796+
797+
<Grid columns={1} gap={2}>
798+
<Grid columns={1} gap={1}>
799+
<Text color="main" variant="labelsTitleCase">
800+
Step 3
801+
</Text>
802+
<Text color="subtle">
803+
Run this command to publish to{" "}
804+
<Link
805+
variant="inherit"
806+
color="inherit"
807+
href={deployTargets[deployTarget].docs}
808+
target="_blank"
809+
rel="noreferrer"
810+
>
811+
{humanizeString(deployTarget)}
812+
</Link>{" "}
813+
</Text>
814+
</Grid>
815+
<Flex gap={2} align="end">
816+
<TextArea
817+
css={{ flex: 1 }}
818+
variant="mono"
819+
readOnly
820+
value={stripIndent(deployTargets[deployTarget].command)
821+
.trimStart()
822+
.replace(/ +$/, "")}
823+
/>
824+
<CopyToClipboard text={deployTargets[deployTarget].command}>
825+
<Button
826+
type="button"
827+
css={{ flexShrink: 0 }}
828+
color="neutral"
829+
prefix={<CopyIcon />}
830+
>
831+
Copy
832+
</Button>
833+
</CopyToClipboard>
834+
</Flex>
835+
</Grid>
836+
837+
<Grid columns={1} gap={1}>
838+
<Text color="subtle">
839+
Read the detailed documentation{" "}
840+
<Link
841+
variant="inherit"
842+
color="inherit"
843+
href="https://wstd.us/cli"
844+
target="_blank"
845+
rel="noreferrer"
846+
>
847+
here
848+
</Link>
849+
</Text>
850+
</Grid>
851+
</Grid>
852+
)}
847853
</Grid>
848854
);
849855
};

packages/cli/src/config.ts

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -53,11 +53,6 @@ export const jsonToGlobalConfig = (json: unknown) => {
5353
export type GlobalConfig = z.infer<typeof zGlobalConfig>;
5454

5555
export const PROJECT_TEMPLATES = [
56-
{
57-
value: "vanilla" as const,
58-
label: "Vanilla",
59-
expand: ["defaults"],
60-
},
6156
{
6257
value: "docker" as const,
6358
label: "Docker",
@@ -68,11 +63,6 @@ export const PROJECT_TEMPLATES = [
6863
label: "Vercel",
6964
expand: ["react-router", "react-router-vercel"],
7065
},
71-
{
72-
value: "vercel-legacy" as const,
73-
label: "Vercel (legacy)",
74-
expand: ["defaults", "vercel"],
75-
},
7666
{
7767
value: "netlify" as const,
7868
label: "Netlify",

packages/feature-flags/src/flags.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ export const aiRadixComponents = false;
55
export const cms = false;
66
export const filters = false;
77
export const xmlElement = false;
8-
export const staticExport = false;
98
export const contentEditableMode = false;
109
export const command = false;
1110
export const headSlotComponent = false;

packages/sdk/src/schema/deployment.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
import { z } from "zod";
22

33
export const Templates = z.enum([
4-
"vanilla",
54
"docker",
65
"vercel",
7-
"vercel-legacy",
86
"netlify",
97
"ssg",
108
"ssg-netlify",

0 commit comments

Comments
 (0)