Merge pull request #10048 from ToolJet/community/marketplace

Community: Marketplace Sprint 2
2026-05-23 17:08:34 +00:00 · 2024-07-01 16:18:55 +05:30 · 2024-07-01 16:18:55 +05:30 · 7e6ceb886c
commit 7e6ceb886c
parent cd47539e18 a29f025012
5 changed files with 75 additions and 41 deletions
--- a/frontend/src/Editor/QueryManager/QueryEditors/TooljetDatabase/ToolJetDbOperations.jsx
+++ b/frontend/src/Editor/QueryManager/QueryEditors/TooljetDatabase/ToolJetDbOperations.jsx
@ -337,9 +337,20 @@ const ToolJetDbOperations = ({ optionchanged, options, darkMode, isHorizontalLay
    ]
  );

+  const triggerTooljetDBStatus = (key) => {
+    if (window.public_config?.ENABLE_TOOLJET_DB !== 'true') {
+      toast('Tooljet database is not enabled.', {
+        icon: '⚠️',
+      });
+    } else if (key === 'addTJDBTable') {
+      navigate(getPrivateRoute('database'));
+    }
+  };
+
  const fetchTables = async () => {
    const { error, data } = await tooljetDatabaseService.findAll(organizationId);

+    triggerTooljetDBStatus();
    if (error) {
      toast.error(error?.message ?? 'Failed to fetch tables');
      return;
@ -503,7 +514,7 @@ const ToolJetDbOperations = ({ optionchanged, options, darkMode, isHorizontalLay
              onChange={(value) => {
                value?.value && handleTableNameSelect(value?.value);
              }}
-              onAdd={() => navigate(getPrivateRoute('database'))}
+              onAdd={() => triggerTooljetDBStatus('addTJDBTable')}
              addBtnLabel={'Add new table'}
              value={generateListForDropdown(tables).find((val) => val?.value === selectedTableId)}
            />
--- a/frontend/src/TooljetDatabase/Drawers/EditRowDrawer/index.jsx
+++ b/frontend/src/TooljetDatabase/Drawers/EditRowDrawer/index.jsx
@ -13,6 +13,7 @@ const EditRowDrawer = ({
  setIsEditRowDrawerOpen,
  selectedRowIds,
  rows,
+  isDirectRowExpand,
  referencedColumnDetails,
  setReferencedColumnDetails,
 }) => {
@ -37,38 +38,40 @@ const EditRowDrawer = ({

  return (
    <>
-      <ButtonSolid
-        variant="tertiary"
-        size="sm"
-        onClick={() => {
-          setIsEditRowDrawerOpen(!isEditRowDrawerOpen);
-        }}
-        className="gap-0"
-        data-cy="edit-row-button-"
-        style={{
-          padding: '4px 8px 4px 8px',
-        }}
-      >
-        {/* <SolidIcon name="editrectangle" width="14" fill={isCreateRowDrawerOpen ? '#3E63DD' : '#889096'} /> */}
-        <svg xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
-          <path
-            d="M8.216 1.30645C8.80114 0.721316 9.74983 0.721316 10.335 1.30645L11.3944 2.36593C11.9796 2.95106 11.9796 3.89975 11.3944 4.48489L10.4551 5.42426C10.3813 5.38774 10.3037 5.34826 10.2233 5.30591C9.68182 5.02084 9.03927 4.62074 8.55972 4.1412C8.08017 3.66165 7.68008 3.01909 7.39501 2.47762C7.35265 2.39716 7.31316 2.31956 7.27664 2.24581L8.216 1.30645Z"
-            fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
-          />
-          <path
-            d="M7.87225 4.82866C8.43972 5.39613 9.1614 5.84275 9.73294 6.14639L6.03887 9.84046C5.80963 10.0697 5.51223 10.2184 5.19129 10.2642L2.96638 10.5821C2.47196 10.6527 2.04817 10.2289 2.1188 9.73451L2.43664 7.5096C2.48249 7.18867 2.6312 6.89126 2.86044 6.66202L6.55451 2.96794C6.85815 3.53949 7.30478 4.26119 7.87225 4.82866Z"
-            fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
-          />
-          <path
-            d="M0.652737 11.562C0.384265 11.562 0.166626 11.7797 0.166626 12.0482C0.166626 12.3166 0.384265 12.5343 0.652737 12.5343H11.3472C11.6157 12.5343 11.8333 12.3166 11.8333 12.0482C11.8333 11.7797 11.6157 11.562 11.3472 11.562H0.652737Z"
-            fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
-          />
-        </svg>
-        &nbsp;&nbsp;
-        <span data-cy="edit-row-button-text" className="tj-text-xsm font-weight-500">
-          Edit row
-        </span>
-      </ButtonSolid>
+      {!isDirectRowExpand && (
+        <ButtonSolid
+          variant="tertiary"
+          size="sm"
+          onClick={() => {
+            setIsEditRowDrawerOpen(!isEditRowDrawerOpen);
+          }}
+          className="gap-0"
+          data-cy="edit-row-button-"
+          style={{
+            padding: '4px 8px 4px 8px',
+          }}
+        >
+          {/* <SolidIcon name="editrectangle" width="14" fill={isCreateRowDrawerOpen ? '#3E63DD' : '#889096'} /> */}
+          <svg xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
+            <path
+              d="M8.216 1.30645C8.80114 0.721316 9.74983 0.721316 10.335 1.30645L11.3944 2.36593C11.9796 2.95106 11.9796 3.89975 11.3944 4.48489L10.4551 5.42426C10.3813 5.38774 10.3037 5.34826 10.2233 5.30591C9.68182 5.02084 9.03927 4.62074 8.55972 4.1412C8.08017 3.66165 7.68008 3.01909 7.39501 2.47762C7.35265 2.39716 7.31316 2.31956 7.27664 2.24581L8.216 1.30645Z"
+              fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
+            />
+            <path
+              d="M7.87225 4.82866C8.43972 5.39613 9.1614 5.84275 9.73294 6.14639L6.03887 9.84046C5.80963 10.0697 5.51223 10.2184 5.19129 10.2642L2.96638 10.5821C2.47196 10.6527 2.04817 10.2289 2.1188 9.73451L2.43664 7.5096C2.48249 7.18867 2.6312 6.89126 2.86044 6.66202L6.55451 2.96794C6.85815 3.53949 7.30478 4.26119 7.87225 4.82866Z"
+              fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
+            />
+            <path
+              d="M0.652737 11.562C0.384265 11.562 0.166626 11.7797 0.166626 12.0482C0.166626 12.3166 0.384265 12.5343 0.652737 12.5343H11.3472C11.6157 12.5343 11.8333 12.3166 11.8333 12.0482C11.8333 11.7797 11.6157 11.562 11.3472 11.562H0.652737Z"
+              fill={isEditRowDrawerOpen ? '#3E63DD' : '#889096'}
+            />
+          </svg>
+          &nbsp;&nbsp;
+          <span data-cy="edit-row-button-text" className="tj-text-xsm font-weight-500">
+            Edit row
+          </span>
+        </ButtonSolid>
+      )}
      <Drawer
        isOpen={isEditRowDrawerOpen}
        onClose={() => setIsEditRowDrawerOpen(false)}
--- a/frontend/src/TooljetDatabase/Table/Header.jsx
+++ b/frontend/src/TooljetDatabase/Table/Header.jsx
@ -29,6 +29,7 @@ const Header = ({
  setIsEditRowDrawerOpen,
  setFilterEnable,
  filterEnable,
+  isDirectRowExpand,
  referencedColumnDetails,
  setReferencedColumnDetails,
 }) => {
@ -149,7 +150,7 @@ const Header = ({
            <div className="row align-items-center">
              <div className="col-8 align-items-center p-3 gap-1">
                <>
-                  {Object.keys(selectedRowIds).length === 0 && (
+                  {(isDirectRowExpand || Object.keys(selectedRowIds).length === 0) && (
                    <>
                      <AddNewDataPopOver
                        disabled={false}
@ -199,11 +200,12 @@ const Header = ({
                      setIsEditRowDrawerOpen={setIsEditRowDrawerOpen}
                      selectedRowIds={selectedRowIds}
                      rows={rows}
+                      isDirectRowExpand={isDirectRowExpand}
                      referencedColumnDetails={referencedColumnDetails}
                      setReferencedColumnDetails={setReferencedColumnDetails}
                    />
                  ) : null}
-                  {Object.keys(selectedRowIds).length > 0 && (
+                  {!isDirectRowExpand && Object.keys(selectedRowIds).length > 0 && (
                    <div>
                      <ButtonSolid
                        variant="dangerTertiary"
--- a/frontend/src/TooljetDatabase/Table/index.jsx
+++ b/frontend/src/TooljetDatabase/Table/index.jsx
@ -87,6 +87,7 @@ const Table = ({ collapseSidebar }) => {
  const [nullValue, setNullValue] = useState(false);
  const [progress, setProgress] = useState(0);
  const [isCellUpdateInProgress, setIsCellUpdateInProgress] = useState(false);
+  const [isDirectRowExpand, setIsDirectRowExpand] = useState(false);
  const [referencedColumnDetails, setReferencedColumnDetails] = useState([]);

  const [cachedOptions, setCahedOptions] = useState({});
@ -225,6 +226,7 @@ const Table = ({ collapseSidebar }) => {
    const newSelectedIdRef = {};
    if (rowIdSelected) newSelectedIdRef[`${rowIdSelected}`] = true;
    setSelectedRowIds(newSelectedIdRef);
+    setIsDirectRowExpand(true);
    return;
  };

@ -401,6 +403,14 @@ const Table = ({ collapseSidebar }) => {
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [selectedTable]);

+  useEffect(() => {
+    if (!isEditRowDrawerOpen && isDirectRowExpand) {
+      setSelectedRowIds({});
+      setIsDirectRowExpand(false);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isEditRowDrawerOpen]);
+
  const tableData = React.useMemo(
    () => (loading ? Array(10).fill({}) : selectedTableData),
    [loading, selectedTableData]
@ -1083,6 +1093,8 @@ const Table = ({ collapseSidebar }) => {
        setIsEditRowDrawerOpen={setIsEditRowDrawerOpen}
        setFilterEnable={setFilterEnable}
        filterEnable={filterEnable}
+        isDirectRowExpand={isDirectRowExpand}
+        setIsDirectRowExpand={setIsDirectRowExpand}
        referencedColumnDetails={referencedColumnDetails}
        setReferencedColumnDetails={setReferencedColumnDetails}
        // getForeignKeyDetails={getForeignKeyDetails}
@ -1156,15 +1168,20 @@ const Table = ({ collapseSidebar }) => {
                    <div>
                      <IndeterminateCheckbox
                        indeterminate={
-                          Object.keys(selectedRowIds).length > 0 && Object.keys(selectedRowIds).length < rows.length
+                          isDirectRowExpand
+                            ? false
+                            : Object.keys(selectedRowIds).length > 0 && Object.keys(selectedRowIds).length < rows.length
+                        }
+                        checked={
+                          isDirectRowExpand ? false : Object.keys(selectedRowIds).length === rows.length && rows.length
                        }
-                        checked={Object.keys(selectedRowIds).length === rows.length && rows.length}
                        onChange={() => toggleSelectOrDeSelectAllRows(rows.length)}
                        style={{
                          backgroundColor: `${
-                            (Object.keys(selectedRowIds).length > 0 &&
+                            (!isDirectRowExpand &&
+                              Object.keys(selectedRowIds).length > 0 &&
                              Object.keys(selectedRowIds).length < rows.length) ||
-                            (Object.keys(selectedRowIds).length === rows.length && rows.length)
+                            (!isDirectRowExpand && Object.keys(selectedRowIds).length === rows.length && rows.length)
                              ? '#3E63DD'
                              : 'var(--base)'
                          }`,
@ -1263,7 +1280,7 @@ const Table = ({ collapseSidebar }) => {
                          }}
                        >
                          <IndeterminateCheckbox
-                            checked={selectedRowIds[row.id] ?? false}
+                            checked={!isDirectRowExpand ? selectedRowIds[row.id] ?? false : false}
                            onChange={() => toggleRowSelection(row.id)}
                          />

--- a/server/src/services/import_export_resources.service.ts
+++ b/server/src/services/import_export_resources.service.ts
@ -53,8 +53,9 @@ export class ImportExportResourcesService {
    let tableNameMapping = {};
    const imports = { app: [], tooljet_database: [] };
    const importingVersion = importResourcesDto.tooljet_version;
+    const isTJDBEnabled = process.env.ENABLE_TOOLJET_DB === 'true';

-    if (!isEmpty(importResourcesDto.tooljet_database)) {
+    if (isTJDBEnabled && !isEmpty(importResourcesDto.tooljet_database)) {
      const res = await this.tooljetDbImportExportService.bulkImport(importResourcesDto, importingVersion, cloning);
      tableNameMapping = res.tableNameMapping;
      imports.tooljet_database = res.tooljet_database;