Skip to content

Commit 6b5e2fa

Browse files
committed
Add beta tag
1 parent 3a52bd6 commit 6b5e2fa

File tree

4 files changed

+77
-33
lines changed

4 files changed

+77
-33
lines changed

Diff for: src/assets/oraclesql-icon.png

-1.11 KB
Loading

Diff for: src/components/EditorHeader/ControlPanel.jsx

+65-29
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import {
2020
InputNumber,
2121
Tooltip,
2222
Spin,
23+
Tag,
2324
Toast,
2425
Popconfirm,
2526
} from "@douyinfe/semi-ui";
@@ -794,54 +795,63 @@ export default function ControlPanel({
794795
import_from: {
795796
children: [
796797
{
797-
JSON: fileImport,
798+
function: fileImport,
799+
name: "JSON",
798800
},
799801
{
800-
DBML: () => {
802+
function: () => {
801803
setModal(MODAL.IMPORT);
802804
setImportFrom(IMPORT_FROM.DBML);
803805
},
806+
name: "DBML",
804807
},
805808
],
806809
},
807810
import_from_source: {
808811
...(database === DB.GENERIC && {
809812
children: [
810813
{
811-
MySQL: () => {
814+
function: () => {
812815
setModal(MODAL.IMPORT_SRC);
813816
setImportDb(DB.MYSQL);
814817
},
818+
name: "MySQL",
815819
},
816820
{
817-
PostgreSQL: () => {
821+
function: () => {
818822
setModal(MODAL.IMPORT_SRC);
819823
setImportDb(DB.POSTGRES);
820824
},
825+
name: "PostgreSQL",
821826
},
822827
{
823-
SQLite: () => {
828+
function: () => {
824829
setModal(MODAL.IMPORT_SRC);
825830
setImportDb(DB.SQLITE);
826831
},
832+
name: "SQLite",
827833
},
828834
{
829-
MariaDB: () => {
835+
function: () => {
830836
setModal(MODAL.IMPORT_SRC);
831837
setImportDb(DB.MARIADB);
832838
},
839+
name: "MariaDB",
833840
},
834841
{
835-
MSSQL: () => {
842+
function: () => {
836843
setModal(MODAL.IMPORT_SRC);
837844
setImportDb(DB.MSSQL);
838845
},
846+
name: "MSSQL",
839847
},
840848
{
841-
Oracle: () => {
849+
function: () => {
842850
setModal(MODAL.IMPORT_SRC);
843851
setImportDb(DB.ORACLESQL);
844852
},
853+
name: "Oracle",
854+
label: "Beta",
845855
},
846856
],
847857
}),
@@ -855,7 +865,8 @@ export default function ControlPanel({
855865
...(database === DB.GENERIC && {
856866
children: [
857867
{
858-
MySQL: () => {
868+
name: "MySQL",
869+
function: () => {
859870
setModal(MODAL.CODE);
860871
const src = jsonToMySQL({
861872
tables: tables,
@@ -871,7 +882,8 @@ export default function ControlPanel({
871882
},
872883
},
873884
{
874-
PostgreSQL: () => {
885+
name: "PostgreSQL",
886+
function: () => {
875887
setModal(MODAL.CODE);
876888
const src = jsonToPostgreSQL({
877889
tables: tables,
@@ -887,7 +899,8 @@ export default function ControlPanel({
887899
},
888900
},
889901
{
890-
SQLite: () => {
902+
name: "SQLite",
903+
function: () => {
891904
setModal(MODAL.CODE);
892905
const src = jsonToSQLite({
893906
tables: tables,
@@ -903,7 +916,8 @@ export default function ControlPanel({
903916
},
904917
},
905918
{
906-
MariaDB: () => {
919+
name: "MariaDB",
920+
function: () => {
907921
setModal(MODAL.CODE);
908922
const src = jsonToMariaDB({
909923
tables: tables,
@@ -919,7 +933,8 @@ export default function ControlPanel({
919933
},
920934
},
921935
{
922-
MSSQL: () => {
936+
name: "MSSQL",
937+
function: () => {
923938
setModal(MODAL.CODE);
924939
const src = jsonToSQLServer({
925940
tables: tables,
@@ -935,7 +950,9 @@ export default function ControlPanel({
935950
},
936951
},
937952
{
938-
OracleSQL: () => {
953+
label: "Beta",
954+
name: "Oracle",
955+
function: () => {
939956
setModal(MODAL.CODE);
940957
const src = jsonToOracleSQL({
941958
tables: tables,
@@ -972,7 +989,8 @@ export default function ControlPanel({
972989
export_as: {
973990
children: [
974991
{
975-
PNG: () => {
992+
name: "PNG",
993+
function: () => {
976994
toPng(document.getElementById("canvas")).then(function (dataUrl) {
977995
setExportData((prev) => ({
978996
...prev,
@@ -984,7 +1002,8 @@ export default function ControlPanel({
9841002
},
9851003
},
9861004
{
987-
JPEG: () => {
1005+
name: "JPEG",
1006+
function: () => {
9881007
toJpeg(document.getElementById("canvas"), { quality: 0.95 }).then(
9891008
function (dataUrl) {
9901009
setExportData((prev) => ({
@@ -998,7 +1017,8 @@ export default function ControlPanel({
9981017
},
9991018
},
10001019
{
1001-
SVG: () => {
1020+
name: "SVG",
1021+
function: () => {
10021022
const filter = (node) => node.tagName !== "i";
10031023
toSvg(document.getElementById("canvas"), { filter: filter }).then(
10041024
function (dataUrl) {
@@ -1013,7 +1033,8 @@ export default function ControlPanel({
10131033
},
10141034
},
10151035
{
1016-
JSON: () => {
1036+
name: "JSON",
1037+
function: () => {
10171038
setModal(MODAL.CODE);
10181039
const result = JSON.stringify(
10191040
{
@@ -1037,7 +1058,8 @@ export default function ControlPanel({
10371058
},
10381059
},
10391060
{
1040-
DBML: () => {
1061+
name: "DBML",
1062+
function: () => {
10411063
setModal(MODAL.CODE);
10421064
const result = toDBML({
10431065
tables,
@@ -1052,7 +1074,8 @@ export default function ControlPanel({
10521074
},
10531075
},
10541076
{
1055-
PDF: () => {
1077+
name: "PDF",
1078+
function: () => {
10561079
const canvas = document.getElementById("canvas");
10571080
toJpeg(canvas).then(function (dataUrl) {
10581081
const doc = new jsPDF("l", "px", [
@@ -1072,7 +1095,8 @@ export default function ControlPanel({
10721095
},
10731096
},
10741097
{
1075-
MERMAID: () => {
1098+
name: "Mermaid",
1099+
function: () => {
10761100
setModal(MODAL.CODE);
10771101
const result = jsonToMermaid({
10781102
tables: tables,
@@ -1090,7 +1114,8 @@ export default function ControlPanel({
10901114
},
10911115
},
10921116
{
1093-
readme: () => {
1117+
name: "Markdown",
1118+
function: () => {
10941119
setModal(MODAL.CODE);
10951120
const result = jsonToDocumentation({
10961121
tables: tables,
@@ -1294,7 +1319,8 @@ export default function ControlPanel({
12941319
theme: {
12951320
children: [
12961321
{
1297-
light: () => {
1322+
name: t("light"),
1323+
function: () => {
12981324
const body = document.body;
12991325
if (body.hasAttribute("theme-mode")) {
13001326
body.setAttribute("theme-mode", "light");
@@ -1304,7 +1330,8 @@ export default function ControlPanel({
13041330
},
13051331
},
13061332
{
1307-
dark: () => {
1333+
name: t("dark"),
1334+
function: () => {
13081335
const body = document.body;
13091336
if (body.hasAttribute("theme-mode")) {
13101337
body.setAttribute("theme-mode", "dark");
@@ -1625,9 +1652,9 @@ export default function ControlPanel({
16251652
const body = document.body;
16261653
if (body.hasAttribute("theme-mode")) {
16271654
if (body.getAttribute("theme-mode") === "light") {
1628-
menu["view"]["theme"].children[1]["dark"]();
1655+
menu["view"]["theme"].children[1].function();
16291656
} else {
1630-
menu["view"]["theme"].children[0]["light"]();
1657+
menu["view"]["theme"].children[0].function();
16311658
}
16321659
}
16331660
}}
@@ -1726,7 +1753,7 @@ export default function ControlPanel({
17261753
if (menu[category][item].children) {
17271754
return (
17281755
<Dropdown
1729-
style={{ width: "120px" }}
1756+
style={{ width: "150px" }}
17301757
key={item}
17311758
position="rightTop"
17321759
render={
@@ -1735,9 +1762,18 @@ export default function ControlPanel({
17351762
(e, i) => (
17361763
<Dropdown.Item
17371764
key={i}
1738-
onClick={Object.values(e)[0]}
1765+
onClick={e.function}
1766+
className="flex justify-between"
17391767
>
1740-
{t(Object.keys(e)[0])}
1768+
<span>{e.name}</span>
1769+
{e.label && (
1770+
<Tag
1771+
size="small"
1772+
color="light-blue"
1773+
>
1774+
{e.label}
1775+
</Tag>
1776+
)}
17411777
</Dropdown.Item>
17421778
),
17431779
)}

Diff for: src/components/Workspace.jsx

+11-4
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import {
1919
useEnums,
2020
} from "../hooks";
2121
import FloatingControls from "./FloatingControls";
22-
import { Modal } from "@douyinfe/semi-ui";
22+
import { Modal, Tag } from "@douyinfe/semi-ui";
2323
import { useTranslation } from "react-i18next";
2424
import { databases } from "../data/databases";
2525
import { isRtl } from "../i18n/utils/rtl";
@@ -161,7 +161,7 @@ export default function WorkSpace() {
161161
enums,
162162
gistId,
163163
loadedFromGistId,
164-
saveState
164+
saveState,
165165
]);
166166

167167
const load = useCallback(async () => {
@@ -462,7 +462,7 @@ export default function WorkSpace() {
462462
}}
463463
okButtonProps={{ disabled: selectedDb === "" }}
464464
>
465-
<div className="grid grid-cols-4 gap-4 place-content-center">
465+
<div className="grid grid-cols-3 gap-4 place-content-center">
466466
{Object.values(databases).map((x) => (
467467
<div
468468
key={x.name}
@@ -473,7 +473,14 @@ export default function WorkSpace() {
473473
: "bg-zinc-100 hover:bg-zinc-200"
474474
} ${selectedDb === x.label ? "border-zinc-400" : "border-transparent"}`}
475475
>
476-
<div className="font-semibold">{x.name}</div>
476+
<div className="flex items-center justify-between">
477+
<div className="font-semibold">{x.name}</div>
478+
{x.beta && (
479+
<Tag size="small" color="light-blue">
480+
Beta
481+
</Tag>
482+
)}
483+
</div>
477484
{x.image && (
478485
<img
479486
src={x.image}

Diff for: src/data/databases.js

+1
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ export const databases = new Proxy(
5050
hasTypes: false,
5151
hasEnums: false,
5252
hasArrays: false,
53+
beta: true,
5354
},
5455
[DB.GENERIC]: {
5556
name: i18n.t("generic"),

0 commit comments

Comments
 (0)