-
-
-
+
+
{t("db_controller.target_table")}
@@ -92,8 +120,8 @@ const CreateRelationshipForm: React.FC = ({ onRelat
/>
-
-
+
+
{t("db_controller.primary_key")}
@@ -106,8 +134,8 @@ const CreateRelationshipForm: React.FC = ({ onRelat
/>
-
-
+
+
{t("db_controller.foreign_key")}
= ({ onRelat
}
- >
+
+
)
}
-export default CreateRelationshipForm;
\ No newline at end of file
+export default CreateRelationshipModal;
\ No newline at end of file
diff --git a/src/pages/database/modals/open-database-modal.tsx b/src/pages/database/modals/open-database-modal.tsx
new file mode 100644
index 0000000..4aa4216
--- /dev/null
+++ b/src/pages/database/modals/open-database-modal.tsx
@@ -0,0 +1,84 @@
+import Modal, { ModalProps } from "@/components/modal/modal";
+import { getDatabaseByDialect } from "@/lib/database";
+import { DatabaseType } from "@/lib/schemas/database-schema";
+
+import { useDatabase, useDatabaseOperations } from "@/providers/database-provider/database-provider";
+
+import { Image, Selection, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow } from "@heroui/react";
+import { Key, useState } from "react";
+import { useTranslation } from "react-i18next";
+
+
+
+
+
+const OpenDatabaseModal: React.FC
= ({ isOpen, onOpenChange }) => {
+
+ const { t } = useTranslation();
+ const { databases } = useDatabase();
+ const { setCurrentDatabaseId } = useDatabaseOperations();
+ const [selectedDatabase, setSelectedDatabase] = useState(undefined);
+ const openDatabase = () => {
+ setCurrentDatabaseId( selectedDatabase.currentKey)
+ }
+
+
+
+ return (
+
+
+
+ Dialect
+ Name
+ Created at
+ Tables
+
+
+ {
+ databases.map((database: DatabaseType) => (
+
+
+
+
+ {database.name}
+ {
+ new Date(database.createdAt as string).toLocaleString("en-US")
+ }
+ {database.numOfTables}
+
+ ))
+ }
+
+
+
+
+
+
+ )
+}
+
+
+export default OpenDatabaseModal;
\ No newline at end of file
diff --git a/src/providers/database-history/database-history-provider.tsx b/src/providers/database-history/database-history-provider.tsx
index 2bc2bb9..ade19b3 100644
--- a/src/providers/database-history/database-history-provider.tsx
+++ b/src/providers/database-history/database-history-provider.tsx
@@ -42,10 +42,13 @@ const DatabaseHistoryProvider: React.FC = ({ children }) => {
}, [redoChanges, udpateDbFlag, isProcessing]);
useEffect(() => {
+
if (!udpateDbFlag.current) {
udpateDbFlag.current = true;
return;
}
+
+
const normalizedDatabase = normalizeDatabase(database);
const normalizedPresent = normalizeDatabase(datatbaseState.present);
diff --git a/src/providers/database-provider/database-context.ts b/src/providers/database-provider/database-context.ts
index e59941c..ed1fa3c 100644
--- a/src/providers/database-provider/database-context.ts
+++ b/src/providers/database-provider/database-context.ts
@@ -1,6 +1,6 @@
import { DataType } from "@/lib/schemas/data-type-schema";
-import { DatabaseType } from "@/lib/schemas/database-schema";
+import { DatabaseInsertType, DatabaseType } from "@/lib/schemas/database-schema";
import { FieldInsertType, FieldType } from "@/lib/schemas/field-schema";
import { IndexInsertType } from "@/lib/schemas/index-schema";
import { RelationshipInsertType } from "@/lib/schemas/relationship-schema";
@@ -15,6 +15,7 @@ import { createContext } from "react";
interface DatabaseDataContextType {
database: DatabaseType,
+ databases : DatabaseType[] ,
isLoading: boolean,
getField: (tableId: string, id: string) => FieldType | undefined,
@@ -23,6 +24,11 @@ interface DatabaseDataContextType {
interface DatabaseOperationsContextType {
data_types: DataType[],
+ // database operations
+ createDatabase: (database: DatabaseInsertType) => Promise,
+ editDatabase: (database: DatabaseInsertType) => Promise,
+ deleteDatabase : ( id : string) => Promise ,
+ setCurrentDatabaseId : ( id : string) => void ,
createTable: (table: TableInsertType) => Promise,
editTable: (table: TableInsertType) => Promise,
@@ -36,10 +42,10 @@ interface DatabaseOperationsContextType {
orderTableFields: (fields: FieldType[]) => Promise,
// index operations
- createIndex : ( index : IndexInsertType) => Promise ,
- editIndex : ( index : IndexInsertType) => Promise ,
- deleteIndex : ( id : string) => Promise ,
- editFieldIndices:( indexId : string , fieldIds : string[])=> Promise ,
+ createIndex: (index: IndexInsertType) => Promise,
+ editIndex: (index: IndexInsertType) => Promise,
+ deleteIndex: (id: string) => Promise,
+ editFieldIndices: (indexId: string, fieldIds: string[]) => Promise,
// relationship operations
createRelationship: (relationship: RelationshipInsertType) => Promise,
editRelationship: (relationship: RelationshipInsertType) => Promise,
diff --git a/src/providers/database-provider/database-provider.tsx b/src/providers/database-provider/database-provider.tsx
index abeac83..7f9055e 100644
--- a/src/providers/database-provider/database-provider.tsx
+++ b/src/providers/database-provider/database-provider.tsx
@@ -10,7 +10,7 @@ import { FieldInsertType, fields, FieldType } from "@/lib/schemas/field-schema";
import { RelationshipInsertType, relationships } from "@/lib/schemas/relationship-schema";
import DatabaseHistoryProvider from "../database-history/database-history-provider";
import { DBDiffOperation } from "@/utils/database";
-import { DatabaseType } from "@/lib/schemas/database-schema";
+import { DatabaseInsertType, DatabaseType, databases as databaseModel } from "@/lib/schemas/database-schema";
import { getTimestamp } from "@/utils/utils";
import { IndexInsertType, indices } from "@/lib/schemas/index-schema";
import { field_indices } from "@/lib/schemas/field_index-schema";
@@ -23,19 +23,19 @@ const DatabaseProvider: React.FC = ({ children }) => {
const [currentDatabaseId, setCurrentDatabaseId] = useState(undefined);
// Fetch all databases
- const { data: databases, isLoading: loadingDatabases } = useQuery(toCompilableQuery(
+ const { data: databases, isLoading: loadingDatabases , isFetching : fetchingDatabases} = useQuery(toCompilableQuery(
db.query.databases.findMany()
));
// Fetch all data types
- const { data: data_types, isLoading: loadingDataTypes } = useQuery(toCompilableQuery(
+ const { data: data_types, isLoading: loadingDataTypes , isFetching : fetchingDataTypes} = useQuery(toCompilableQuery(
db.query.data_types.findMany()
));
// Fetch the current database with nested tables, fields, and relationships
- let { data: database, isLoading: loadingCurrentDatabase } = useQuery(
+ let { data: database, isLoading: loadingCurrentDatabase , isFetching : fetchingCurrentDatabase} = useQuery(
toCompilableQuery(
- db.query.databases.findFirst({
+ db.query.databases.findMany({
where: (databases, { eq }) => eq(databases.id, currentDatabaseId as string),
with: {
tables: {
@@ -68,9 +68,9 @@ const DatabaseProvider: React.FC = ({ children }) => {
})
)
);
-
-
-
+
+
+
// Normalize result to single object
if (database.length == 1)
database = database[0] as any;
@@ -82,7 +82,22 @@ const DatabaseProvider: React.FC = ({ children }) => {
}
}, [currentDatabaseId, databases])
- const isLoading: boolean = loadingDataTypes || loadingDatabases || loadingCurrentDatabase;
+ const isLoading: boolean = loadingDataTypes || loadingDatabases || loadingCurrentDatabase ;
+ // CRUD for database
+ const createDatabase = useCallback(async (database: DatabaseInsertType): Promise => {
+ return await db.insert(databaseModel).values({
+ ...database,
+ createdAt: getTimestamp()
+ });
+ }, [db]);
+
+ const editDatabase = useCallback(async (database: DatabaseInsertType): Promise => {
+ return await db.update(databaseModel).set(database).where(eq(databaseModel.id, database.id))
+ }, [db]);
+
+ const deleteDatabase = useCallback(async (id: string): Promise => {
+ await db.delete(databaseModel).where(eq(databaseModel.id, id));
+ }, [db]);
// CRUD operations for Tables
const createTable = useCallback(async (table: TableInsertType): Promise => {
@@ -219,6 +234,7 @@ const DatabaseProvider: React.FC = ({ children }) => {
// Apply a list of diff operations to sync database
const executeDbDiffOps = useCallback(async (operations: DBDiffOperation[]) => {
try {
+ console.log ("excuted diff operations")
await db.transaction(async (tx) => {
for (const operation of operations) {
if (operation.type == "CREATE_TABLE") {
@@ -253,9 +269,9 @@ const DatabaseProvider: React.FC = ({ children }) => {
}
else if (operation.type == "CREATE_INDEX") {
await tx.insert(indices).values(operation.index);
- if (operation.index.fieldIndices && Object.values(operation.index.fieldIndices).length > 0)
- await tx.insert(field_indices).values(Object.values(operation.index.fieldIndices));
-
+ if (operation.index.fieldIndices && Object.values(operation.index.fieldIndices).length > 0)
+ await tx.insert(field_indices).values(Object.values(operation.index.fieldIndices));
+
}
else if (operation.type == "DELETE_INDEX") {
await tx.delete(indices).where(eq(indices.id, operation.indexId));
@@ -279,6 +295,11 @@ const DatabaseProvider: React.FC = ({ children }) => {
}, [db]);
const databaseOpsValue = useMemo(() => ({
+
+ createDatabase,
+ editDatabase,
+ deleteDatabase,
+ setCurrentDatabaseId,
createTable,
editTable,
deleteTable,
@@ -299,6 +320,9 @@ const DatabaseProvider: React.FC = ({ children }) => {
editFieldIndices,
data_types
}), [
+ createDatabase,
+ editDatabase,
+ deleteDatabase,
createTable,
editTable,
deleteTable,
@@ -324,6 +348,7 @@ const DatabaseProvider: React.FC = ({ children }) => {
diff --git a/src/providers/modal-provider/modal-contxet.tsx b/src/providers/modal-provider/modal-contxet.tsx
index eb6f717..7604c7f 100644
--- a/src/providers/modal-provider/modal-contxet.tsx
+++ b/src/providers/modal-provider/modal-contxet.tsx
@@ -1,18 +1,14 @@
-import { createContext } from "react";
+import { createContext } from "react";
export enum Modals {
- CREATE_RELATIONSHIP = "CREATE_RELATIONSHIP"
+ CREATE_RELATIONSHIP = "CREATE_RELATIONSHIP",
+ CREATE_DATABASE = "CREATE_DATABASE" ,
+ OPEN_DATABASE = "OPEN_DATABASE"
}
-
-
-
-
-
interface ModalContextType {
- focusedTableId: string | undefined;
- focusedRelationshipId: string | undefined;
+ open: (modal: Modals, props?: any) => void
}
export const ModalContext = createContext({} as ModalContextType);
diff --git a/src/providers/modal-provider/modal-provider.tsx b/src/providers/modal-provider/modal-provider.tsx
index 4e0211c..136ea2c 100644
--- a/src/providers/modal-provider/modal-provider.tsx
+++ b/src/providers/modal-provider/modal-provider.tsx
@@ -1,35 +1,56 @@
-/*
+
import { useCallback, useContext, useState } from "react"
import { ModalContext, Modals } from "./modal-contxet"
-import Modal, { ModalProps } from "@/components/modal/modal";
import { useDisclosure } from "@heroui/react";
+import CreateRelationshipModal from "@/pages/database/modals/create-relationship-modal";
+import { CreateDatabaseModal } from "@/pages/database/modals/create-database-modal";
+import OpenDatabaseModal from "@/pages/database/modals/open-database-modal";
+
interface Props { children: React.ReactNode }
interface CurrentModalProps {
modal: Modals,
- modalProps: ModalProps,
- content?: any
+ props?: any,
+
}
-const ModalProvider: React.FC = ({ children }) => {
- const { isOpen, onOpen } = useDisclosure();
+export const ModalProvider: React.FC = ({ children }) => {
+
const [currentModal, setCurrentModal] = useState(undefined);
+ const { isOpen, onOpen, onClose } = useDisclosure();
+ const open = useCallback((modal: Modals, props?: any) => {
- const onOpenChange = useCallback(() => {
+ setCurrentModal({
+ modal,
+ props
+ });
onOpen();
- setCurrentModal(undefined);
- }, [onOpen]);
+ }, []);
-
+ const onOpenChange = (isOpen: boolean) => {
+ if (!isOpen) {
+ onClose();
+ setCurrentModal(undefined);
+ }
+ }
return (
-
+
{
- currentModal &&
-
-
-
+ currentModal ? (
+ currentModal.modal == Modals.CREATE_RELATIONSHIP &&
+
+ ||
+ currentModal.modal == Modals.CREATE_DATABASE &&
+
+ ||
+ currentModal.modal == Modals.OPEN_DATABASE &&
+
+ ) : undefined
}
{children}
@@ -37,6 +58,5 @@ const ModalProvider: React.FC = ({ children }) => {
}
-export const useModal = () => useContext(ModalContext);
+export const useModal = () => useContext(ModalContext);
-*/
\ No newline at end of file
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 0a60d5b..b4493d9 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -129,4 +129,9 @@ svg.text-icon:hover {
.dark .bg-background-50 {
background-color: red !important;
+}
+
+
+.database-checkbox[data-selected="true"]{
+ border : 1.5px solid hsl(var(--heroui-primary-300));
}
\ No newline at end of file
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index e062430..1840d3c 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -58,5 +58,6 @@ function excludeFields(
export {
areArraysEqual,
getTimestamp,
- excludeFields
+ excludeFields ,
+
}
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index c1f68b5..5df8e31 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -22,7 +22,7 @@ export default {
},
themes: {
-
+
dark: {
colors: {
@@ -39,8 +39,9 @@ export default {
DEFAULT: "#cecfd2"
},
content1: {
- DEFAULT: "#282d34"
+ DEFAULT: "#1c2026"
},
+
default: {
50: '#f2f3f5',
100: '#d6d7db',