feat: implement workspace runtime selection
This commit is contained in:
2
.gitignore
vendored
2
.gitignore
vendored
@@ -214,3 +214,5 @@ $RECYCLE.BIN/
|
||||
# End of https://www.toptal.com/developers/gitignore/api/macos,windows,linux,go,goland
|
||||
|
||||
data.sqlite
|
||||
|
||||
dist/
|
||||
|
@@ -5,6 +5,7 @@ CREATE TABLE IF NOT EXISTS workspaces
|
||||
container_id TEXT NOT NULL,
|
||||
image_tag TEXT NOT NULL,
|
||||
created_at TEXT NOT NULL,
|
||||
runtime TEXT NOT NULL,
|
||||
|
||||
CONSTRAINT pk_workspaces PRIMARY KEY (id)
|
||||
);
|
||||
|
@@ -6,7 +6,7 @@ type baseTemplate struct {
|
||||
Content string `json:"-"`
|
||||
}
|
||||
|
||||
var baseTemplates = []baseTemplate{fedora40WithSSH}
|
||||
var baseTemplates = []baseTemplate{fedora40WithSSH, fedora40SSHDocker}
|
||||
|
||||
var baseTemplateMap = map[string]baseTemplate{
|
||||
"empty": {
|
||||
@@ -15,6 +15,7 @@ var baseTemplateMap = map[string]baseTemplate{
|
||||
Content: "",
|
||||
},
|
||||
"fedora-40-openssh": fedora40WithSSH,
|
||||
"fedora-40-openssh-docker": fedora40SSHDocker,
|
||||
}
|
||||
|
||||
var fedora40WithSSH = baseTemplate{
|
||||
@@ -22,12 +23,36 @@ var fedora40WithSSH = baseTemplate{
|
||||
ID: "fedora-40-openssh",
|
||||
Content: `FROM fedora:40
|
||||
|
||||
ARG user
|
||||
ARG password
|
||||
|
||||
RUN dnf install -y openssh-server \
|
||||
&& mkdir -p /etc/ssh \
|
||||
&& ssh-keygen -q -N "" -t rsa -b 4096 -f /etc/ssh/ssh_host_rsa_key \
|
||||
&& useradd testuser \
|
||||
&& echo "testuser:12345678" | chpasswd
|
||||
&& usermod -aG wheel testuser
|
||||
&& useradd "$user" \
|
||||
&& echo "$user:$password" | chpasswd \
|
||||
&& usermod -aG wheel "$user"
|
||||
|
||||
CMD ["/usr/sbin/sshd", "-D"]
|
||||
`,
|
||||
}
|
||||
|
||||
var fedora40SSHDocker = baseTemplate{
|
||||
Name: "Fedora 40 + OpenSSH Server + Docker",
|
||||
ID: "fedora-40-openssh-docker",
|
||||
Content: `FROM fedora:40
|
||||
|
||||
ARG user
|
||||
ARG password
|
||||
|
||||
RUN dnf install -y openssh-server dnf-plugins-core \
|
||||
&& dnf-3 config-manager --add-repo https://download.docker.com/linux/fedora/docker-ce.repo \
|
||||
&& dnf install -y docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin \
|
||||
&& mkdir -p /etc/ssh \
|
||||
&& ssh-keygen -q -N "" -t rsa -b 4096 -f /etc/ssh/ssh_host_rsa_key \
|
||||
&& useradd "$user" \
|
||||
&& echo "$user:$password" | chpasswd \
|
||||
&& usermod -aG wheel,docker "$user"
|
||||
|
||||
CMD ["/usr/sbin/sshd", "-D"]
|
||||
`,
|
||||
|
@@ -10,6 +10,7 @@ import (
|
||||
|
||||
type createWorkspaceRequestBody struct {
|
||||
ImageID string `json:"imageId"`
|
||||
Runtime string `json:"runtime"`
|
||||
}
|
||||
|
||||
type updateWorkspaceRequestBody struct {
|
||||
@@ -79,6 +80,7 @@ func createWorkspace(c echo.Context, workspaceName string) error {
|
||||
w, err := mgr.createWorkspace(c.Request().Context(), createWorkspaceOptions{
|
||||
name: workspaceName,
|
||||
imageID: body.ImageID,
|
||||
runtime: body.Runtime,
|
||||
})
|
||||
if err != nil {
|
||||
if errors.Is(err, errImageNotFound) {
|
||||
@@ -164,3 +166,12 @@ func deleteWorkspacePortMapping(c echo.Context) error {
|
||||
|
||||
return c.NoContent(http.StatusOK)
|
||||
}
|
||||
|
||||
func fetchWorkspaceRuntimes(c echo.Context) error {
|
||||
mgr := workspaceManagerFrom(c)
|
||||
runtimes, err := mgr.findAvailableWorkspaceRuntimes(c.Request().Context())
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
return c.JSON(http.StatusOK, runtimes)
|
||||
}
|
||||
|
@@ -11,4 +11,5 @@ func DefineRoutes(g *echo.Group, services service.Services) {
|
||||
g.POST("/workspaces/:workspaceName", updateOrCreateWorkspace, currentWorkspaceMiddleware(true))
|
||||
g.DELETE("/workspaces/:workspaceName", deleteWorkspace, currentWorkspaceMiddleware(false))
|
||||
g.DELETE("/workspaces/:workspaceName/forwarded-ports/:portName", deleteWorkspacePortMapping, currentWorkspaceMiddleware(false))
|
||||
g.GET("/workspace-runtimes", fetchWorkspaceRuntimes)
|
||||
}
|
||||
|
@@ -36,6 +36,8 @@ type workspace struct {
|
||||
Status status `bun:"-" json:"status"`
|
||||
|
||||
PortMappings []portMapping `bun:"rel:has-many,join:id=workspace_id" json:"ports,omitempty"`
|
||||
|
||||
Runtime string `json:"runtime"`
|
||||
}
|
||||
|
||||
type portMapping struct {
|
||||
@@ -48,6 +50,11 @@ type portMapping struct {
|
||||
Workspace workspace `bun:"rel:belongs-to,join:workspace_id=id" json:"-"`
|
||||
}
|
||||
|
||||
type workspaceRuntime struct {
|
||||
Name string `json:"name"`
|
||||
Path string `json:"path"`
|
||||
}
|
||||
|
||||
// status represents the status of a workspace.
|
||||
type status string
|
||||
|
||||
|
@@ -31,10 +31,12 @@ type workspaceManager struct {
|
||||
type createWorkspaceOptions struct {
|
||||
name string
|
||||
imageID string
|
||||
runtime string
|
||||
}
|
||||
|
||||
var errImageNotFound = errors.New("image not found")
|
||||
var errWorkspaceNotFound = errors.New("workspace not found")
|
||||
var errRuntimeNotFound = errors.New("runtime not found")
|
||||
|
||||
func (mgr workspaceManager) findAllWorkspaces(ctx context.Context) ([]workspace, error) {
|
||||
var workspaces []workspace
|
||||
@@ -126,6 +128,16 @@ func (mgr workspaceManager) hasWorkspace(ctx context.Context, name string) (bool
|
||||
}
|
||||
|
||||
func (mgr workspaceManager) createWorkspace(ctx context.Context, opts createWorkspaceOptions) (*workspace, error) {
|
||||
info, err := mgr.dockerClient.Info(ctx)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
_, ok := info.Runtimes[opts.runtime]
|
||||
if !ok {
|
||||
return nil, errRuntimeNotFound
|
||||
}
|
||||
|
||||
tx, err := mgr.db.BeginTx(ctx, nil)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
@@ -157,6 +169,7 @@ func (mgr workspaceManager) createWorkspace(ctx context.Context, opts createWork
|
||||
{"127.0.0.1", ""},
|
||||
},
|
||||
},
|
||||
Runtime: opts.runtime,
|
||||
}
|
||||
|
||||
res, err := mgr.dockerClient.ContainerCreate(ctx, containerConfig, hostConfig, nil, nil, opts.name)
|
||||
@@ -372,3 +385,20 @@ func (mgr workspaceManager) deletePortMapping(ctx context.Context, workspace *wo
|
||||
|
||||
return nil
|
||||
}
|
||||
|
||||
func (mgr workspaceManager) findAvailableWorkspaceRuntimes(ctx context.Context) ([]workspaceRuntime, error) {
|
||||
info, err := mgr.dockerClient.Info(ctx)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
runtimes := make([]workspaceRuntime, 0, len(info.Runtimes))
|
||||
for name, r := range info.Runtimes {
|
||||
runtimes = append(runtimes, workspaceRuntime{
|
||||
Name: name,
|
||||
Path: r.Path,
|
||||
})
|
||||
}
|
||||
|
||||
return runtimes, nil
|
||||
}
|
||||
|
@@ -197,6 +197,7 @@ function BuildArgRow({
|
||||
|
||||
const finishEditing = useCallback(() => {
|
||||
onFinish({ argName, arg });
|
||||
setIsEditing(false);
|
||||
}, [argName, arg, onFinish]);
|
||||
|
||||
return (
|
||||
|
@@ -4,10 +4,17 @@ import {
|
||||
WorkspaceStatus,
|
||||
type Workspace,
|
||||
type WorkspacePortMapping,
|
||||
type WorkspaceRuntime,
|
||||
} from "./types";
|
||||
import { useCallback, useState } from "react";
|
||||
import type { QueryStatus } from "@/lib/query";
|
||||
|
||||
interface CreateWorkspaceConfig {
|
||||
workspaceName: string;
|
||||
imageId: string;
|
||||
runtime: string;
|
||||
}
|
||||
|
||||
function useWorkspaces() {
|
||||
return useSWR(
|
||||
"/workspaces",
|
||||
@@ -24,17 +31,15 @@ function useCreateWorkspace() {
|
||||
async ({
|
||||
workspaceName,
|
||||
imageId,
|
||||
}: {
|
||||
workspaceName: string;
|
||||
imageId: string;
|
||||
}): Promise<Workspace | null> => {
|
||||
runtime,
|
||||
}: CreateWorkspaceConfig): Promise<Workspace | null> => {
|
||||
setStatus({ type: "loading" });
|
||||
try {
|
||||
const workspace = await mutate(
|
||||
"/workspaces",
|
||||
fetchApi(`/workspaces/${workspaceName}`, {
|
||||
method: "POST",
|
||||
body: JSON.stringify({ imageId }),
|
||||
body: JSON.stringify({ imageId, runtime }),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
@@ -195,10 +200,19 @@ function useAddWorkspacePort() {
|
||||
return { addWorkspacePort, status };
|
||||
}
|
||||
|
||||
function useWorkspaceRuntimes() {
|
||||
return useSWR(
|
||||
"/workspace-runtimes",
|
||||
(): Promise<WorkspaceRuntime[]> =>
|
||||
fetchApi("/workspace-runtimes").then((res) => res.json()),
|
||||
);
|
||||
}
|
||||
|
||||
export {
|
||||
useWorkspaces,
|
||||
useCreateWorkspace,
|
||||
useChangeWorkspaceStatus,
|
||||
useDeleteWorkspace,
|
||||
useAddWorkspacePort,
|
||||
useWorkspaceRuntimes,
|
||||
};
|
||||
|
@@ -27,24 +27,101 @@ import { superstructResolver } from "@hookform/resolvers/superstruct";
|
||||
import { useRef, useEffect } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { nonempty, object, pattern, string, type Infer } from "superstruct";
|
||||
import { useCreateWorkspace } from "./api";
|
||||
import { useCreateWorkspace, useWorkspaceRuntimes } from "./api";
|
||||
import type { TemplateImage } from "@/templates/types";
|
||||
import type { WorkspaceRuntime } from "./types";
|
||||
|
||||
interface NewWorkspaceDialogProps {
|
||||
onCreateSuccess: () => void;
|
||||
}
|
||||
|
||||
const NewWorkspaceForm = object({
|
||||
const NewWorkspaceFormSchema = object({
|
||||
workspaceName: pattern(string(), /^[\w-]+$/),
|
||||
imageId: nonempty(string()),
|
||||
runtime: nonempty(string()),
|
||||
});
|
||||
|
||||
function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
|
||||
const { data: templateImages, isLoading, error } = useTemplateImages();
|
||||
const {
|
||||
data: templateImages,
|
||||
isLoading: isLoadingImages,
|
||||
error,
|
||||
} = useTemplateImages();
|
||||
const { data: runtimes, isLoading: isLoadingRuntimes } =
|
||||
useWorkspaceRuntimes();
|
||||
const isLoading = isLoadingImages || isLoadingRuntimes;
|
||||
|
||||
function content() {
|
||||
if (error) {
|
||||
console.log(error);
|
||||
return (
|
||||
<p className="opacity-80">
|
||||
An error occurred when fetching available options.
|
||||
</p>
|
||||
);
|
||||
}
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="w-full flex items-center justify-center">
|
||||
<LoadingSpinner />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
if (!templateImages || !runtimes) {
|
||||
return null;
|
||||
}
|
||||
if (templateImages.length === 0) {
|
||||
return (
|
||||
<>
|
||||
<p className="opacity-80">
|
||||
No images found. Create and build a template, and the resulting
|
||||
image will show up here.
|
||||
</p>
|
||||
<Alert>
|
||||
<AlertTitle>What are images?</AlertTitle>
|
||||
<AlertDescription>
|
||||
An image is used to bootstrap a workspace, including the operating
|
||||
system, the environment, and packages, as specified by a template.
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<NewWorkspaceForm
|
||||
templateImages={templateImages}
|
||||
runtimes={runtimes}
|
||||
onCreateSuccess={onCreateSuccess}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>New workspace</DialogTitle>
|
||||
</DialogHeader>
|
||||
{content()}
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
function NewWorkspaceForm({
|
||||
templateImages,
|
||||
runtimes,
|
||||
onCreateSuccess,
|
||||
}: {
|
||||
templateImages: TemplateImage[];
|
||||
runtimes: WorkspaceRuntime[];
|
||||
onCreateSuccess: () => void;
|
||||
}) {
|
||||
const form = useForm({
|
||||
resolver: superstructResolver(NewWorkspaceForm),
|
||||
resolver: superstructResolver(NewWorkspaceFormSchema),
|
||||
defaultValues: {
|
||||
workspaceName: "",
|
||||
imageId: "",
|
||||
runtime: "",
|
||||
},
|
||||
});
|
||||
const { createWorkspace, status } = useCreateWorkspace();
|
||||
@@ -77,50 +154,14 @@ function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
|
||||
}
|
||||
}, [status.type, toast, onCreateSuccess]);
|
||||
|
||||
async function onSubmit(values: Infer<typeof NewWorkspaceForm>) {
|
||||
async function onSubmit(values: Infer<typeof NewWorkspaceFormSchema>) {
|
||||
await createWorkspace({
|
||||
workspaceName: values.workspaceName,
|
||||
imageId: values.imageId,
|
||||
runtime: values.runtime,
|
||||
});
|
||||
}
|
||||
|
||||
function content() {
|
||||
if (error) {
|
||||
console.log(error);
|
||||
return (
|
||||
<p className="opacity-80">
|
||||
An error occurred when fetching available options.
|
||||
</p>
|
||||
);
|
||||
}
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="w-full flex items-center justify-center">
|
||||
<LoadingSpinner />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
if (!templateImages) {
|
||||
return null;
|
||||
}
|
||||
if (templateImages.length === 0) {
|
||||
return (
|
||||
<>
|
||||
<p className="opacity-80">
|
||||
No images found. Create and build a template, and the resulting
|
||||
image will show up here.
|
||||
</p>
|
||||
<Alert>
|
||||
<AlertTitle>What are images?</AlertTitle>
|
||||
<AlertDescription>
|
||||
An image is used to bootstrap a workspace, including the operating
|
||||
system, the environment, and packages, as specified by a template.
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Form {...form}>
|
||||
<form
|
||||
@@ -151,10 +192,7 @@ function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Image for this workspace</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select an image" />
|
||||
@@ -173,6 +211,30 @@ function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="runtime"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Docker runtime</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select a Docker runtime" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{runtimes.map((runtime) => (
|
||||
<SelectItem key={runtime.name} value={runtime.name}>
|
||||
{runtime.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<DialogFooter>
|
||||
<Button type="submit">Create</Button>
|
||||
</DialogFooter>
|
||||
@@ -181,14 +243,4 @@ function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>New workspace</DialogTitle>
|
||||
</DialogHeader>
|
||||
{content()}
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
export { NewWorkspaceDialog };
|
||||
|
@@ -20,5 +20,10 @@ interface Workspace {
|
||||
ports?: WorkspacePortMapping[];
|
||||
}
|
||||
|
||||
interface WorkspaceRuntime {
|
||||
name: string;
|
||||
path: string;
|
||||
}
|
||||
|
||||
export { WorkspaceStatus };
|
||||
export type { Workspace, WorkspacePortMapping };
|
||||
export type { Workspace, WorkspaceRuntime, WorkspacePortMapping };
|
||||
|
Reference in New Issue
Block a user