From 90639322b7baab5debf46b1d4f0835656b07783c Mon Sep 17 00:00:00 2001
From: Steven <stevenlgtm@gmail.com>
Date: Tue, 13 Sep 2022 09:00:54 +0800
Subject: [PATCH] chore: add visibility selector in create shortcut dialog
---
web/src/components/CreateShortcutDialog.tsx | 33 +++++++++++++++++++++
1 file changed, 33 insertions(+)
diff --git a/web/src/components/CreateShortcutDialog.tsx b/web/src/components/CreateShortcutDialog.tsx
index 20a52e8..1df7f6d 100644
--- a/web/src/components/CreateShortcutDialog.tsx
+++ b/web/src/components/CreateShortcutDialog.tsx
@@ -14,6 +14,7 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
const { destroy, workspaceId, shortcutId } = props;
const [name, setName] = useState<string>("");
const [link, setLink] = useState<string>("");
+ const [visibility, setVisibility] = useState<Visibility>("PRIVATE");
const requestState = useLoading(false);
useEffect(() => {
@@ -36,6 +37,11 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
setLink(text);
};
+ const handleVisibilityInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+ const text = e.target.value as string;
+ setVisibility(text as Visibility);
+ };
+
const handleSaveBtnClick = async () => {
if (!name) {
toastHelper.error("Name is required");
@@ -81,6 +87,33 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
<span className="mb-2">Link</span>
<input className="w-full rounded border px-2 py-2" type="text" value={link} onChange={handleLinkInputChange} />
</div>
+ <div className="w-full flex flex-col justify-start items-start mb-3">
+ <span className="mb-2">Visibility</span>
+ <div className="w-full flex flex-row justify-start items-center text-base">
+ <input
+ type="radio"
+ name="visibility"
+ id="visibility-private"
+ value="PRIVATE"
+ onChange={handleVisibilityInputChange}
+ checked={visibility === "PRIVATE"}
+ />
+ <label htmlFor="visibility-private" className="ml-1 mr-4">
+ Only for myself
+ </label>
+ <input
+ type="radio"
+ name="visibility"
+ id="visibility-workspace"
+ value="WORKSPACE"
+ onChange={handleVisibilityInputChange}
+ checked={visibility === "WORKSPACE"}
+ />
+ <label htmlFor="visibility-workspace" className="ml-1">
+ Public in workspace
+ </label>
+ </div>
+ </div>
<div className="w-full flex flex-row justify-end items-center">
<button
className={`border rounded px-3 py-2 border-green-600 bg-green-600 text-white hover:bg-green-700 ${