Skip to content

Commit

Permalink
Resolve reference panel content
Browse files Browse the repository at this point in the history
  • Loading branch information
rm-dr committed Nov 16, 2024
1 parent eb538ab commit 50fd42c
Show file tree
Hide file tree
Showing 8 changed files with 469 additions and 86 deletions.
59 changes: 53 additions & 6 deletions copperc/src/lib/api/openapi.ts
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export interface paths {
path?: never;
cookie?: never;
};
/** Get class info */
/** List items in this class */
get: operations["list_items"];
put?: never;
post?: never;
Expand Down Expand Up @@ -625,6 +625,7 @@ export interface components {
class: number;
/** Format: int64 */
item: number;
primary_attr: components["schemas"]["PrimaryAttrData"];
/** @enum {string} */
type: "Reference";
};
Expand Down Expand Up @@ -762,6 +763,57 @@ export interface components {
[key: string]: components["schemas"]["NodeJson"];
};
};
PrimaryAttrData:
| {
/** @enum {string} */
type: "NotAvailable";
}
| {
/** Format: int64 */
attr: number;
/** @enum {string} */
type: "Text";
value: string;
}
| {
/** Format: int64 */
attr: number;
/** @enum {string} */
type: "Integer";
/** Format: int64 */
value: number;
}
| {
/** Format: int64 */
attr: number;
/** @enum {string} */
type: "Float";
/** Format: double */
value: number;
}
| {
/** Format: int64 */
attr: number;
/** @enum {string} */
type: "Boolean";
value: boolean;
}
| {
/** Format: int64 */
attr: number;
/** @enum {string} */
type: "Hash";
value: string;
}
| {
/** Format: int64 */
attr: number;
mime: string;
/** Format: int64 */
size?: number | null;
/** @enum {string} */
type: "Blob";
};
QueuedJobCounts: {
/** Format: int64 */
build_errors: number;
Expand Down Expand Up @@ -819,11 +871,6 @@ export interface components {
/** @enum {string} */
state: "FailedRunning";
}
| {
message: string;
/** @enum {string} */
state: "FailedTransaction";
}
| {
/** @enum {string} */
state: "Success";
Expand Down
107 changes: 58 additions & 49 deletions copperc/src/lib/attributes/impls/blob.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,59 +45,68 @@ export const _blobAttrType: attrTypeInfo<"Blob"> = {
type: "panel",

panel_body: (params) => {
const data_url = `/api/item/${params.item_id}/attr/${params.attr_id}`;
return <BlobPanel {...params} />;
},
},
};

let inner: ReactNode | null = (
<_PanelBodyUnknown
src={data_url}
icon={<X />}
attr_value={params.value}
/>
);
export function BlobPanel(params: {
item_id: number;
attr_id: number;
value: {
mime: string;
size?: number | null;
type: "Blob";
};
inner?: boolean;
}) {
const data_url = `/api/item/${params.item_id}/attr/${params.attr_id}`;

if (params.value.mime != null && params.value.mime.startsWith("image/")) {
inner = <_PanelBodyImage src={data_url} attr_value={params.value} />;
} else if (
params.value.mime != null &&
params.value.mime.startsWith("audio/")
) {
inner = <_PanelBodyAudio src={data_url} attr_value={params.value} />;
}
let inner: ReactNode | null = (
<_PanelBodyUnknown src={data_url} icon={<X />} attr_value={params.value} />
);

return (
<div
style={{
height: "100%",
width: "100%",
display: "flex",
flexDirection: "column",
}}
if (params.value.mime != null && params.value.mime.startsWith("image/")) {
inner = <_PanelBodyImage src={data_url} attr_value={params.value} />;
} else if (
params.value.mime != null &&
params.value.mime.startsWith("audio/")
) {
inner = <_PanelBodyAudio src={data_url} attr_value={params.value} />;
}

return (
<div
style={{
height: "100%",
width: "100%",
display: "flex",
flexDirection: "column",
}}
>
<div
style={{
width: "100%",
flexGrow: 1,
padding: params.inner !== true ? "0.5rem" : undefined,
cursor: "zoom-in",
}}
>
<a
target="_blank"
href={data_url}
rel="noopener noreferrer"
style={{ width: "100%", height: "100%", cursor: "inherit" }}
>
<div
style={{
width: "100%",
flexGrow: 1,
padding: params.inner !== true ? "0.5rem" : undefined,
cursor: "zoom-in",
}}
>
<a
target="_blank"
href={data_url}
rel="noopener noreferrer"
style={{ width: "100%", height: "100%", cursor: "inherit" }}
>
{inner}
</a>
</div>
{params.inner !== true ? (
<_PanelBottom attr_value={params.value} />
) : null}
</div>
);
},
},
};
{inner}
</a>
</div>
{params.inner !== true ? (
<_PanelBottom attr_value={params.value} />
) : null}
</div>
);
}

// Same as basicform, but with the "unique" switch hidden.
// It has no effect on blobs.
Expand Down
80 changes: 78 additions & 2 deletions copperc/src/lib/attributes/impls/reference.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { useMutation, useQuery } from "@tanstack/react-query";
import { ReactElement } from "react";
import { Select } from "@mantine/core";
import { useForm, UseFormReturnType } from "@mantine/form";
import { BlobPanel } from "./blob";

export const _referenceAttrType: attrTypeInfo<"Reference"> = {
pretty_name: "Reference",
Expand Down Expand Up @@ -43,8 +44,83 @@ export const _referenceAttrType: attrTypeInfo<"Reference"> = {
editor: {
type: "panel",

panel_body: () => {
return "todo-ref";
panel_body: (params) => {
const pa = params.value.primary_attr;

if (pa.type === "NotAvailable") {
return (
<div
style={{
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center",

paddingLeft: "0.5rem",
width: "100%",
height: "100%",

color: "var(--mantine-color-dimmed)",
fontStyle: "italic",
fontWeight: 500,
fontSize: "1.2rem",
userSelect: "none",
}}
>
No attribute available
</div>
);
}

if (pa.type === "Blob") {
return (
<BlobPanel
item_id={params.value.item}
attr_id={pa.attr}
value={pa}
inner={true}
/>
);
}

let v = <div>UNSET!</div>;
if (pa.type === "Boolean") {
v = pa.value ? (
<span style={{ color: "var(--mantine-color-green-5)" }}>true</span>
) : (
<span style={{ color: "var(--mantine-color-red-5)" }}>false</span>
);
} else if (pa.type === "Float" || pa.type === "Integer") {
v = <span>{pa.value}</span>;
} else if (pa.type === "Hash") {
v = <span style={{ fontFamily: "monospace" }}>{pa.value}</span>;
} else if (pa.type === "Text") {
v = <span>{pa.value}</span>;
}

return (
<div
style={{
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center",

paddingLeft: "0.5rem",
width: "100%",
height: "100%",

color: "var(--mantine-color-dimmed)",
fontStyle: "italic",
fontWeight: 500,
fontSize: "1.2rem",
userSelect: "none",
}}
>
<div>{pa.type}</div>
{v}
</div>
);
},
},
};
Expand Down
Loading

0 comments on commit 50fd42c

Please sign in to comment.