wip session

This commit is contained in:
rizky 2024-08-15 08:16:57 -07:00
parent 2b38732e06
commit 32330d08e6
6 changed files with 145 additions and 23 deletions

View File

@ -7,6 +7,7 @@ import { ChangeEvent, FC } from "react";
import { FMLocal, FieldLocal, FieldProp } from "../../typings"; import { FMLocal, FieldLocal, FieldProp } from "../../typings";
import { ThumbPreview } from "./FilePreview"; import { ThumbPreview } from "./FilePreview";
import { PropTypeInput } from "./TypeInput"; import { PropTypeInput } from "./TypeInput";
import { translate } from "lib/lang";
export const FieldUploadMulti: FC<{ export const FieldUploadMulti: FC<{
field: FieldLocal; field: FieldLocal;
@ -179,30 +180,35 @@ export const FieldUploadMulti: FC<{
url={value || ""} url={value || ""}
options={ options={
<div className={cx("c-flex c-flex-col c-space-y-1")}> <div className={cx("c-flex c-flex-col c-space-y-1")}>
<div <Tooltip
onClick={(e) => { content={`${translate("Delete")}`}
e.preventDefault(); placement="right"
e.stopPropagation();
if (confirm("Remove this file ?")) {
list.splice(idx, 1);
fm.data[field.name] = JSON.stringify(list);
fm.render();
}
}}
className={cx(
"c-flex c-flex-row c-items-center c-px-1 c-rounded c-bg-white c-cursor-pointer hover:c-bg-red-100 transition-all btn-del",
css`
width: 25px;
height: 25px;
`
)}
> >
<Trash2 className="c-text-red-500 c-h-4 c-w-4 " /> <div
</div> onClick={(e) => {
e.preventDefault();
e.stopPropagation();
if (confirm(translate("Remove this file ?"))) {
list.splice(idx, 1);
fm.data[field.name] = JSON.stringify(list);
fm.render();
}
}}
className={cx(
"c-flex c-flex-row c-items-center c-px-1 c-rounded c-bg-white c-cursor-pointer hover:c-bg-red-100 transition-all btn-del",
css`
width: 25px;
height: 25px;
`
)}
>
<Trash2 className="c-text-red-500 c-h-4 c-w-4 " />
</div>
</Tooltip>
{cover.field && ( {cover.field && (
<Tooltip <Tooltip
content={`Mark as ${cover.text}`} content={`${translate("Mark as")} ${cover.text}`}
placement="right" placement="right"
> >
<div <div
@ -309,7 +315,7 @@ export const FieldUploadMulti: FC<{
<Upload className="c-h-4 c-w-4" /> <Upload className="c-h-4 c-w-4" />
</div> </div>
<div className="c-flex c-flex-row c-items-center c-text-sm"> <div className="c-flex c-flex-row c-items-center c-text-sm">
Upload Multiple Files {translate("Upload Multiple Files")}
</div> </div>
</div> </div>
</div> </div>

View File

@ -3,7 +3,10 @@ export const langEn = {
Save: "Save", Save: "Save",
Delete: "Delete", Delete: "Delete",
"Record Saved": "Record Saved", "Record Saved": "Record Saved",
"Search": "Search", Search: "Search",
"Add Another": "Add Another", "Add Another": "Add Another",
"Back To List": "Back To List" "Mark as": "Mark as ",
"Remove this file ?": "Remove this file ?",
"Upload Multiple Files":"Upload Multiple Files",
"Back To List": "Back To List",
}; };

View File

@ -7,5 +7,9 @@ export const langId: Record<LangKeyword, string> = {
"Record Saved": "Data Tersimpan", "Record Saved": "Data Tersimpan",
Search: "Cari", Search: "Cari",
"Add Another": "Tambah Baru", "Add Another": "Tambah Baru",
"Mark as": "Tandai sebagai",
"Remove this file ?": "Hapus file ini ?",
"Upload Multiple Files": "Unggah Beberapa File",
"Back To List": "Kembali ke List", "Back To List": "Kembali ke List",
}; };

View File

@ -20,6 +20,7 @@
"@types/lodash.capitalize": "^4.2.9", "@types/lodash.capitalize": "^4.2.9",
"@types/lodash.get": "^4.4.9", "@types/lodash.get": "^4.4.9",
"@types/react": "^18.2.65", "@types/react": "^18.2.65",
"bun-types": "^1.1.24",
"@types/react-dom": "^18.3.0", "@types/react-dom": "^18.3.0",
"@types/uuid": "^9.0.8", "@types/uuid": "^9.0.8",
"@wojtekmaj/react-qr-svg": "^1.0.0", "@wojtekmaj/react-qr-svg": "^1.0.0",

81
session/client.ts Executable file
View File

@ -0,0 +1,81 @@
const w = window as unknown as {
_prasi_session: any;
_prasi: { site_id: string };
};
export type SessionData = Record<string, any> & { role: string };
type SessionResponse<T> =
| { active: false; reason: string }
| { active: true; data: T; token: string };
export const sessionClient = async <T extends SessionData>(arg: {
editorSampleData: T;
auth: {
mode: "user-pass";
login: (arg: { username: string; password: string }) => Promise<false | T>;
};
on?: Partial<{
active: (arg: { token: string; data: T }) => any;
expired: () => any;
logout: () => any;
broadcast: (arg: { data: any }) => any;
}>;
}): Promise<Session<T>> => {
const session: Session<T> = {
active: false,
id_site: w._prasi.site_id,
async login() {},
async logout() {},
token: "",
data: {} as T,
};
if (isEditor) {
session.active = true;
session.data = arg.editorSampleData;
return session;
}
if (w._prasi_session) return w._prasi_session as Session<T>;
const s = localStorage.getItem(`prss-${session.id_site}`);
if (!s) {
session.active = false;
} else {
let url = siteurl("/_session");
if (
location.hostname === "prasi.avolut.com" ||
location.host === "localhost:4550"
) {
const newurl = new URL(location.href);
newurl.pathname = `/_proxy/${url}`;
url = newurl.toString();
}
const prss = await fetch(url, { method: "POST", body: s });
try {
const resp = (await prss.json()) as SessionResponse<T>;
if (resp) {
if (resp.active) {
session.data = resp.data;
session.active = true;
session.token = resp.token;
} else {
console.warn("Session inactive, reason:" + resp.reason);
}
}
} catch (e) {
console.warn("Failed to activate session");
}
}
return session;
};
export type Session<T extends SessionData> = {
active: boolean;
id_site: string;
login: (arg: { username: string; password: string }) => Promise<void>;
logout: () => Promise<void>;
token: string;
data: T;
};

27
session/server.ts Executable file
View File

@ -0,0 +1,27 @@
/// <reference types="bun-types" />
type ServerSession = {
handle: (arg: {
req: Request;
handle: (req: Request) => Promise<Response>;
mode: "dev" | "prod";
url: {
raw: URL;
pathname: string;
};
}) => Promise<Response>;
};
export const sessionServer = (arg: { encrypt?: boolean }): ServerSession => {
const s: ServerSession = {
async handle({ req, handle, mode, url }) {
if (url.pathname.startsWith("/_session")) {
return new Response("marjio");
}
return await handle(req);
},
};
return s;
};