Files
keystone/resources/js/pages/environment-variables/Edit.vue
Harry Bayliss 5b977c1f41
Some checks failed
CI / Lint (push) Failing after 22s
CI / Tests (push) Failing after 33s
wowowowowo
2026-05-28 15:15:41 +01:00

111 lines
3.7 KiB
Vue

<script setup lang="ts">
import InputError from "@/components/InputError.vue";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import AppLayout from "@/layouts/AppLayout.vue";
import { Head, router, useForm } from "@inertiajs/vue3";
const props = defineProps<{
application: Record<string, any>;
environment: Record<string, any>;
variable: Record<string, any>;
}>();
const form = useForm({
key: props.variable.key,
value: props.variable.value ?? "",
overridable: Boolean(props.variable.overridable),
});
const destroyVariable = (): void => {
if (!window.confirm(`Delete ${props.variable.key}?`)) {
return;
}
router.delete(
route("environment-variables.destroy", {
organisation: props.application.organisation_id,
application: props.application.id,
environment: props.environment.id,
variable: props.variable.id,
}),
);
};
</script>
<template>
<Head :title="`Edit ${variable.key}`" />
<AppLayout
:breadcrumbs="[
{
title: environment.name,
href: route('environments.show', {
organisation: $page.props.organisation.id,
application: application.id,
environment: environment.id,
}),
},
{
title: 'Variables',
href: route('environment-variables.index', {
organisation: $page.props.organisation.id,
application: application.id,
environment: environment.id,
}),
},
{ title: variable.key },
]"
>
<form
class="flex h-full max-w-2xl flex-1 flex-col gap-5 p-4"
@submit.prevent="
form.put(
route('environment-variables.update', {
organisation: $page.props.organisation.id,
application: application.id,
environment: environment.id,
variable: variable.id,
}),
)
"
>
<div>
<h2 class="text-3xl font-bold tracking-tight">Edit Environment Variable</h2>
<div class="mt-2 flex flex-wrap gap-2">
<Badge :variant="variable.source === 'user' ? 'secondary' : 'outline'">
{{ variable.source.replace("_", " ") }}
</Badge>
<Badge variant="outline">secret</Badge>
</div>
</div>
<div class="grid gap-2">
<Label for="key">Key</Label>
<Input id="key" v-model="form.key" required />
<InputError :message="form.errors.key" />
</div>
<div class="grid gap-2">
<Label for="value">Value</Label>
<Input id="value" v-model="form.value" type="password" />
<InputError :message="form.errors.value" />
</div>
<label class="flex items-center gap-2 text-sm">
<input v-model="form.overridable" type="checkbox" class="size-4" />
Overridable by managed attachments
</label>
<div class="flex flex-wrap justify-between gap-2">
<Button type="button" variant="destructive" @click="destroyVariable">
Delete variable
</Button>
<Button type="submit" :disabled="form.processing">Save variable</Button>
</div>
</form>
</AppLayout>
</template>