Clan create: add template url field
This commit is contained in:
@@ -3,3 +3,9 @@
|
|||||||
@tailwind base;
|
@tailwind base;
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
|
||||||
|
html {
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
@@ -8,7 +8,12 @@ import {
|
|||||||
createEffect,
|
createEffect,
|
||||||
createSignal,
|
createSignal,
|
||||||
} from "solid-js";
|
} from "solid-js";
|
||||||
import { SubmitHandler, createForm, required } from "@modular-forms/solid";
|
import {
|
||||||
|
SubmitHandler,
|
||||||
|
createForm,
|
||||||
|
required,
|
||||||
|
custom,
|
||||||
|
} from "@modular-forms/solid";
|
||||||
import toast from "solid-toast";
|
import toast from "solid-toast";
|
||||||
import { setCurrClanURI, setRoute } from "@/src/App";
|
import { setCurrClanURI, setRoute } from "@/src/App";
|
||||||
import { isValidHostname } from "@/util";
|
import { isValidHostname } from "@/util";
|
||||||
@@ -21,14 +26,21 @@ interface ClanFormProps {
|
|||||||
actions: JSX.Element;
|
actions: JSX.Element;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
type CreateForm = Meta & {
|
||||||
|
template_url: string;
|
||||||
|
};
|
||||||
|
|
||||||
export const ClanForm = (props: ClanFormProps) => {
|
export const ClanForm = (props: ClanFormProps) => {
|
||||||
const { actions } = props;
|
const { actions } = props;
|
||||||
const [formStore, { Form, Field }] = createForm<ClanMeta>({
|
const [formStore, { Form, Field }] = createForm<CreateForm>({
|
||||||
initialValues: {},
|
initialValues: {
|
||||||
|
template_url: "git+https://git.clan.lol/clan/clan-core#templates.minimal",
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const handleSubmit: SubmitHandler<ClanMeta> = (values, event) => {
|
const handleSubmit: SubmitHandler<CreateForm> = (values, event) => {
|
||||||
console.log("submit", values);
|
console.log("submit", values);
|
||||||
|
const { template_url, ...meta } = values;
|
||||||
pyApi.open_file.dispatch({
|
pyApi.open_file.dispatch({
|
||||||
file_request: {
|
file_request: {
|
||||||
mode: "save",
|
mode: "save",
|
||||||
@@ -70,7 +82,7 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
pyApi.create_clan.dispatch({
|
pyApi.create_clan.dispatch({
|
||||||
options: { directory: target_dir, meta: values },
|
options: { directory: target_dir, meta, template_url },
|
||||||
op_key: "create_clan",
|
op_key: "create_clan",
|
||||||
});
|
});
|
||||||
}),
|
}),
|
||||||
@@ -84,7 +96,7 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div class="card card-compact w-96 bg-base-100 shadow-xl">
|
<div class="card card-normal">
|
||||||
<Form onSubmit={handleSubmit}>
|
<Form onSubmit={handleSubmit}>
|
||||||
<Field name="icon">
|
<Field name="icon">
|
||||||
{(field, props) => (
|
{(field, props) => (
|
||||||
@@ -110,14 +122,13 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</Field>
|
</Field>
|
||||||
<div class="card-body">
|
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<Field
|
<Field
|
||||||
name="name"
|
name="name"
|
||||||
validate={[required("Please enter a unique name for the clan.")]}
|
validate={[required("Please enter a unique name for the clan.")]}
|
||||||
>
|
>
|
||||||
{(field, props) => (
|
{(field, props) => (
|
||||||
<label class="form-control w-full max-w-xs">
|
<label class="form-control w-full">
|
||||||
<div class="label">
|
<div class="label">
|
||||||
<span class="label-text block after:ml-0.5 after:text-primary after:content-['*']">
|
<span class="label-text block after:ml-0.5 after:text-primary after:content-['*']">
|
||||||
Name
|
Name
|
||||||
@@ -128,7 +139,7 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
{...props}
|
{...props}
|
||||||
required
|
required
|
||||||
placeholder="Clan Name"
|
placeholder="Clan Name"
|
||||||
class="input w-full max-w-xs"
|
class="input input-bordered"
|
||||||
classList={{ "input-error": !!field.error }}
|
classList={{ "input-error": !!field.error }}
|
||||||
value={field.value}
|
value={field.value}
|
||||||
/>
|
/>
|
||||||
@@ -142,7 +153,7 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
</Field>
|
</Field>
|
||||||
<Field name="description">
|
<Field name="description">
|
||||||
{(field, props) => (
|
{(field, props) => (
|
||||||
<label class="form-control w-full max-w-xs">
|
<label class="form-control w-full">
|
||||||
<div class="label">
|
<div class="label">
|
||||||
<span class="label-text">Description</span>
|
<span class="label-text">Description</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -152,7 +163,7 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
required
|
required
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Some words about your clan"
|
placeholder="Some words about your clan"
|
||||||
class="input w-full max-w-xs"
|
class="input input-bordered"
|
||||||
classList={{ "input-error": !!field.error }}
|
classList={{ "input-error": !!field.error }}
|
||||||
value={field.value || ""}
|
value={field.value || ""}
|
||||||
/>
|
/>
|
||||||
@@ -164,26 +175,40 @@ export const ClanForm = (props: ClanFormProps) => {
|
|||||||
</label>
|
</label>
|
||||||
)}
|
)}
|
||||||
</Field>
|
</Field>
|
||||||
{actions}
|
<Field name="template_url" validate={[required("This is required")]}>
|
||||||
|
{(field, props) => (
|
||||||
|
<div class="collapse collapse-arrow" tabindex="0">
|
||||||
|
<input type="checkbox" />
|
||||||
|
<div class="collapse-title link font-medium ">Advanced</div>
|
||||||
|
<div class="collapse-content">
|
||||||
|
<label class="form-control w-full">
|
||||||
|
<div class="label ">
|
||||||
|
<span class="label-text after:ml-0.5 after:text-primary after:content-['*']">
|
||||||
|
Template to use
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
<input
|
||||||
|
{...props}
|
||||||
|
required
|
||||||
|
type="text"
|
||||||
|
placeholder="Template to use"
|
||||||
|
class="input input-bordered"
|
||||||
|
classList={{ "input-error": !!field.error }}
|
||||||
|
value={field.value}
|
||||||
|
/>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</Field>
|
||||||
|
{actions}
|
||||||
</div>
|
</div>
|
||||||
</Form>
|
</Form>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
// export const EditMetaFields = (props: MetaFieldsProps) => {
|
type Meta = Extract<
|
||||||
// const { meta, editable, actions, directory } = props;
|
|
||||||
|
|
||||||
// const [editing, setEditing] = createSignal<
|
|
||||||
// keyof MetaFieldsProps["meta"] | null
|
|
||||||
// >(null);
|
|
||||||
// return (
|
|
||||||
|
|
||||||
// );
|
|
||||||
// };
|
|
||||||
|
|
||||||
type ClanMeta = Extract<
|
|
||||||
OperationResponse<"show_clan_meta">,
|
OperationResponse<"show_clan_meta">,
|
||||||
{ status: "success" }
|
{ status: "success" }
|
||||||
>["data"];
|
>["data"];
|
||||||
@@ -198,7 +223,7 @@ export const ClanDetails = (props: ClanDetailsProps) => {
|
|||||||
>["errors"]
|
>["errors"]
|
||||||
| null
|
| null
|
||||||
>(null);
|
>(null);
|
||||||
const [data, setData] = createSignal<ClanMeta>();
|
const [data, setData] = createSignal<Meta>();
|
||||||
|
|
||||||
const loadMeta = () => {
|
const loadMeta = () => {
|
||||||
pyApi.show_clan_meta.dispatch({ uri: directory });
|
pyApi.show_clan_meta.dispatch({ uri: directory });
|
||||||
@@ -226,7 +251,6 @@ export const ClanDetails = (props: ClanDetailsProps) => {
|
|||||||
const meta = data();
|
const meta = data();
|
||||||
return (
|
return (
|
||||||
<ClanForm
|
<ClanForm
|
||||||
meta={meta}
|
|
||||||
actions={
|
actions={
|
||||||
<div class="card-actions justify-between">
|
<div class="card-actions justify-between">
|
||||||
<button class="btn btn-link" onClick={() => loadMeta()}>
|
<button class="btn btn-link" onClick={() => loadMeta()}>
|
||||||
|
|||||||
Reference in New Issue
Block a user