@seafile/seafile-database 0.0.21 → 0.0.23

package/dist/views/card/card-items/index.js

@@ -1,189 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _emptyTip = _interopRequireDefault(require("../../../common/components/empty-tip"));
-var _imagePreviewer = _interopRequireDefault(require("../../../components/image-previewer"));
-var _constants = require("../../../constants");
-var _hooks = require("../../../hooks");
-var _translate = _interopRequireDefault(require("../../../lang/translate"));
-var _cell = require("../../../utils/cell");
-var _file = require("../../../utils/file");
-var _row = require("../../../utils/row");
-var _cardItem = _interopRequireDefault(require("./card-item"));
-require("./index.css");
-// import ContextMenu from '../context-menu';
-
-const CardItems = _ref => {
-  let {
-    modifyRecord,
-    deleteRecords,
-    modifyColumnData,
-    onCloseSettings
-  } = _ref;
-  const {
-    context
-  } = (0, _hooks.useFileRepoContext)();
-  const {
-    tagsData
-  } = (0, _hooks.useTagsData)();
-  const {
-    metadata,
-    isDirentDetailShow,
-    updateCurrentDirent,
-    updateSelectedRecordIds
-  } = (0, _hooks.useMetadata)();
-  const containerRef = (0, _react.useRef)(null);
-  const currentImageRef = (0, _react.useRef)(null);
-  const [selectedCard, setSelectedCard] = (0, _react.useState)('');
-  const [isImagePreviewerVisible, setImagePreviewerVisible] = (0, _react.useState)(false);
-  const repoID = context.getViewSetting('repoID');
-  const repoInfo = context.getViewSetting('repoInfo');
-  (0, _react.useEffect)(() => {
-    const unsubscribe = context.eventBus.subscribe(_constants.EVENT_BUS_TYPE.UPDATE_SELECTED_RECORD_IDS, ids => {
-      setSelectedCard(Array.isArray(ids) ? ids[0] : null);
-    });
-    return () => {
-      unsubscribe && unsubscribe();
-    };
-  }, [context.eventBus]);
-  const fileNameColumn = (0, _react.useMemo)(() => {
-    return metadata.key_column_map[_constants.PRIVATE_COLUMN_KEY.FILE_NAME];
-  }, [metadata.key_column_map]);
-  const mtimeColumn = (0, _react.useMemo)(() => {
-    return metadata.key_column_map[_constants.PRIVATE_COLUMN_KEY.FILE_MTIME];
-  }, [metadata.key_column_map]);
-  const modifierColumn = (0, _react.useMemo)(() => {
-    return metadata.key_column_map[_constants.PRIVATE_COLUMN_KEY.FILE_MODIFIER];
-  }, [metadata.key_column_map]);
-  const displayColumns = (0, _react.useMemo)(() => {
-    const displayColumnsConfig = metadata.view.settings[_constants.CARD_SETTINGS_KEYS.COLUMNS];
-    if (!displayColumnsConfig) return [];
-    return displayColumnsConfig.filter(config => config.shown).map(config => metadata.key_column_map[config.key]);
-  }, [metadata.key_column_map, metadata.view.settings]);
-  const displayEmptyValue = (0, _react.useMemo)(() => !metadata.view.settings[_constants.CARD_SETTINGS_KEYS.HIDE_EMPTY_VALUE], [metadata.view.settings]);
-  const displayColumnName = (0, _react.useMemo)(() => metadata.view.settings[_constants.CARD_SETTINGS_KEYS.SHOW_COLUMN_NAME], [metadata.view.settings]);
-  const textWrap = (0, _react.useMemo)(() => metadata.view.settings[_constants.CARD_SETTINGS_KEYS.TEXT_WRAP], [metadata.view.settings]);
-  const records = (0, _react.useMemo)(() => {
-    const {
-      rows
-    } = metadata;
-    return rows || [];
-  }, [metadata]);
-  const onOpenFile = (0, _react.useCallback)(record => {
-    const repoID = context.getViewSetting('repoID');
-    const canPreview = context.canPreview();
-    if (!canPreview) return;
-    (0, _file.openFile)(record, repoID, () => {
-      currentImageRef.current = record;
-      setImagePreviewerVisible(true);
-    });
-  }, [context]);
-  const closeImagePreviewer = (0, _react.useCallback)(() => {
-    currentImageRef.current = null;
-    setImagePreviewerVisible(false);
-  }, []);
-  const handleUpdateCurrentDirent = (0, _react.useCallback)(record => {
-    if (!record) return;
-    const recordId = (0, _cell.getRecordIdFromRecord)(record);
-    const name = (0, _cell.getFileNameFromRecord)(record);
-    const path = (0, _cell.getParentDirFromRecord)(record);
-    const isDir = (0, _row.checkIsDir)(record);
-    updateCurrentDirent && updateCurrentDirent({
-      id: recordId,
-      type: isDir ? 'dir' : 'file',
-      mtime: '',
-      name,
-      path,
-      file_tags: []
-    });
-    setSelectedCard(recordId);
-    updateSelectedRecordIds([recordId]);
-  }, [updateCurrentDirent, updateSelectedRecordIds]);
-  const onSelectCard = (0, _react.useCallback)(record => {
-    const recordId = (0, _cell.getRecordIdFromRecord)(record);
-    if (selectedCard === recordId) return;
-    handleUpdateCurrentDirent(record);
-    onCloseSettings();
-  }, [selectedCard, onCloseSettings, handleUpdateCurrentDirent]);
-  const handleClickOutside = (0, _react.useCallback)(event => {
-    setSelectedCard(null);
-    updateSelectedRecordIds([]);
-    updateCurrentDirent();
-  }, [updateCurrentDirent, updateSelectedRecordIds]);
-  const onContextMenu = (0, _react.useCallback)((event, recordId) => {
-    event.preventDefault();
-    if (selectedCard === recordId) return;
-    const record = (0, _row.getRowById)(metadata, recordId);
-    handleUpdateCurrentDirent(record);
-  }, [metadata, selectedCard, handleUpdateCurrentDirent]);
-  const onDeleteRecords = (0, _react.useCallback)(recordIds => {
-    deleteRecords(recordIds, {
-      success_callback: () => {
-        setSelectedCard(null);
-        updateSelectedRecordIds([]);
-        updateCurrentDirent();
-      }
-    });
-  }, [deleteRecords, updateCurrentDirent, updateSelectedRecordIds]);
-  const onRename = (0, _react.useCallback)((rowId, updates, oldRowData, originalUpdates, originalOldRowData, _ref2) => {
-    let {
-      success_callback
-    } = _ref2;
-    modifyRecord(rowId, updates, oldRowData, originalUpdates, originalOldRowData, {
-      success_callback: operation => {
-        success_callback && success_callback(operation);
-        const record = (0, _row.getRowById)(metadata, rowId);
-        handleUpdateCurrentDirent(record);
-      }
-    });
-  }, [metadata, modifyRecord, handleUpdateCurrentDirent]);
-  (0, _react.useEffect)(() => {
-    if (!isDirentDetailShow) {
-      setSelectedCard(null);
-      updateSelectedRecordIds([]);
-    }
-  }, [isDirentDetailShow, updateSelectedRecordIds]);
-  if (records.length === 0) {
-    return /*#__PURE__*/_react.default.createElement(_emptyTip.default, {
-      text: _translate.default.gettext('No items')
-    });
-  }
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    ref: containerRef,
-    className: (0, _classnames.default)('sf-metadata-view-card-items-container', {
-      'sf-metadata-view-card-items-container-text-wrap': textWrap
-    }),
-    onClick: handleClickOutside
-  }, records.map((record, index) => {
-    const isSelected = selectedCard === record._id;
-    return /*#__PURE__*/_react.default.createElement(_cardItem.default, {
-      key: index,
-      isSelected: isSelected,
-      record: record,
-      tagsData: tagsData,
-      fileNameColumn: fileNameColumn,
-      mtimeColumn: mtimeColumn,
-      modifierColumn: modifierColumn,
-      displayColumns: displayColumns,
-      displayEmptyValue: displayEmptyValue,
-      displayColumnName: displayColumnName,
-      onOpenFile: onOpenFile,
-      onSelectCard: onSelectCard,
-      onContextMenu: e => onContextMenu(e, record._id)
-    });
-  })), isImagePreviewerVisible && /*#__PURE__*/_react.default.createElement(_imagePreviewer.default, {
-    repoID: repoID,
-    repoInfo: repoInfo,
-    record: currentImageRef.current,
-    table: metadata,
-    closeImagePopup: closeImagePreviewer
-  }));
-};
-var _default = exports.default = CardItems;

package/dist/views/card/context-menu/index.js

@@ -1,165 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _cell = require("../../../utils/cell");
-var _column = require("../../../utils/column");
-var _file = require("../../../utils/file");
-var _row = require("../../../utils/row");
-var _table = require("../../../../components/sf-table/utils/table");
-var _fileOperations = require("../../../../hooks/file-operations");
-var _metadataStatus = require("../../../../hooks/metadata-status");
-var _textTranslation = _interopRequireDefault(require("../../../../utils/text-translation"));
-var _contextMenu = _interopRequireDefault(require("../../../components/context-menu"));
-var _renameDialog = _interopRequireDefault(require("../../../components/dialog/rename-dialog"));
-var _constants = require("../../../constants");
-var _metadataView = require("../../../hooks/metadata-view");
-var _menuBuilder = require("../../../utils/menu-builder");
-const CardContextMenu = _ref => {
-  let {
-    selectedCard,
-    onDelete,
-    onRename
-  } = _ref;
-  const [isRenameDialogShow, setIsRenameDialogShow] = (0, _react.useState)(false);
-  const {
-    enableFaceRecognition,
-    enableTags
-  } = (0, _metadataStatus.useMetadataStatus)();
-  const {
-    handleDownload: handleDownloadAPI
-  } = (0, _fileOperations.useFileOperations)();
-  const {
-    metadata,
-    updateRecordDetails,
-    updateFaceRecognition,
-    updateRecordDescription,
-    onOCR,
-    generateFileTags
-  } = (0, _metadataView.useMetadataView)();
-  const selectedRecord = (0, _react.useMemo)(() => (0, _table.getRowById)(metadata, selectedCard), [metadata, selectedCard]);
-  const isDir = (0, _react.useMemo)(() => (0, _row.checkIsDir)(selectedRecord), [selectedRecord]);
-  const oldName = (0, _react.useMemo)(() => (0, _cell.getFileNameFromRecord)(selectedRecord), [selectedRecord]);
-  const parentDir = (0, _react.useMemo)(() => (0, _cell.getParentDirFromRecord)(selectedRecord), [selectedRecord]);
-  const repoID = window.sfMetadataContext.getSetting('repoID');
-  const readOnly = !window.sfMetadataContext.canModify();
-  const record = (0, _react.useMemo)(() => (0, _table.getRowById)(metadata, selectedCard), [metadata, selectedCard]);
-  const options = (0, _react.useMemo)(() => {
-    const metadataStatus = {
-      enableFaceRecognition,
-      enableGenerateDescription: (0, _column.getColumnByKey)(metadata.columns, _constants.PRIVATE_COLUMN_KEY.FILE_DESCRIPTION) !== null,
-      enableTags
-    };
-    return (0, _menuBuilder.buildCardMenuOptions)([record], readOnly, metadataStatus);
-  }, [enableFaceRecognition, metadata.columns, enableTags, record, readOnly]);
-  const openRenameDialog = (0, _react.useCallback)(() => {
-    setIsRenameDialogShow(true);
-  }, []);
-  const handleRename = (0, _react.useCallback)(newName => {
-    if (!selectedCard) return;
-    const record = (0, _table.getRowById)(metadata, selectedCard);
-    if (!record) return;
-    const oldName = (0, _cell.getFileNameFromRecord)(record);
-    const updates = {
-      [_constants.PRIVATE_COLUMN_KEY.FILE_NAME]: newName
-    };
-    const oldRowData = {
-      [_constants.PRIVATE_COLUMN_KEY.FILE_NAME]: oldName
-    };
-    onRename(selectedCard, updates, oldRowData, updates, oldRowData, {
-      success_callback: () => setIsRenameDialogShow(false)
-    });
-  }, [metadata, selectedCard, onRename]);
-  const handleDownload = (0, _react.useCallback)(() => {
-    handleDownloadAPI(parentDir, [{
-      name: oldName,
-      is_dir: isDir
-    }]);
-  }, [handleDownloadAPI, parentDir, oldName, isDir]);
-  const handleOptionClick = (0, _react.useCallback)(option => {
-    switch (option.key) {
-      case _textTranslation.default.OPEN_FILE_IN_NEW_TAB.key:
-        {
-          (0, _file.openInNewTab)(repoID, record);
-          break;
-        }
-      case _textTranslation.default.OPEN_PARENT_FOLDER.key:
-        {
-          (0, _file.openParentFolder)(record);
-          break;
-        }
-      case _textTranslation.default.RENAME.key:
-        {
-          openRenameDialog();
-          break;
-        }
-      case _textTranslation.default.MOVE.key:
-        window.sfMetadataContext.eventBus.dispatch(_constants.EVENT_BUS_TYPE.TOGGLE_MOVE_DIALOG, [record]);
-        break;
-      case _textTranslation.default.COPY.key:
-        window.sfMetadataContext.eventBus.dispatch(_constants.EVENT_BUS_TYPE.TOGGLE_COPY_DIALOG, [record]);
-        break;
-      case _textTranslation.default.DOWNLOAD.key:
-        {
-          handleDownload();
-          break;
-        }
-      case _textTranslation.default.DELETE.key:
-        {
-          onDelete([selectedCard]);
-          break;
-        }
-      case _textTranslation.default.DETECT_FACES.key:
-        {
-          updateFaceRecognition([record]);
-          break;
-        }
-      case _textTranslation.default.EXTRACT_FILE_DETAIL.key:
-        {
-          updateRecordDetails([record]);
-          break;
-        }
-      case _textTranslation.default.GENERATE_DESCRIPTION.key:
-        {
-          updateRecordDescription(record);
-          break;
-        }
-      case _textTranslation.default.GENERATE_TAGS.key:
-        {
-          generateFileTags(record);
-          break;
-        }
-      case _textTranslation.default.EXTRACT_TEXT.key:
-        {
-          onOCR(record, '.sf-metadata-card-item-image-container');
-          break;
-        }
-      default:
-        {
-          break;
-        }
-    }
-  }, [record, updateFaceRecognition, repoID, openRenameDialog, handleDownload, onDelete, selectedCard, updateRecordDetails, updateRecordDescription, generateFileTags, onOCR]);
-  (0, _react.useEffect)(() => {
-    const unsubscribe = window.sfMetadataContext.eventBus.subscribe(_constants.EVENT_BUS_TYPE.TOGGLE_CARD_RENAME_DIALOG, openRenameDialog);
-    return () => {
-      unsubscribe();
-    };
-  }, [openRenameDialog]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_contextMenu.default, {
-    options: options,
-    onOptionClick: handleOptionClick,
-    allowedTriggerElements: ['.sf-metadata-view-card']
-  }), isRenameDialogShow && /*#__PURE__*/_react.default.createElement(_renameDialog.default, {
-    isDir: isDir,
-    oldName: oldName,
-    onSubmit: handleRename,
-    onCancel: () => setIsRenameDialogShow(false)
-  }));
-};
-var _default = exports.default = CardContextMenu;

package/dist/views/card/index.js

@@ -1,64 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _constants = require("../../constants");
-var _hooks = require("../../hooks");
-var _cardItems = _interopRequireDefault(require("./card-items"));
-// import Settings from './settings';
-
-const Card = () => {
-  const [isShowSettings, setShowSettings] = (0, _react.useState)(false);
-  const {
-    context
-  } = (0, _hooks.useFileRepoContext)();
-  const {
-    metadata,
-    modifySettings,
-    modifyRecord: modifyRecordAPI,
-    deleteRecords,
-    modifyColumnData
-  } = (0, _hooks.useMetadata)();
-  const columns = (0, _react.useMemo)(() => metadata.view.columns, [metadata.view.columns]);
-  const modifyRecord = (0, _react.useCallback)(function (rowId, updates, oldRowData, originalUpdates, originalOldRowData) {
-    let {
-      success_callback
-    } = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
-    modifyRecordAPI(rowId, updates, oldRowData, originalUpdates, originalOldRowData, false, {
-      success_callback: () => {
-        success_callback && success_callback();
-        context.eventBus.dispatch(_constants.EVENT_BUS_TYPE.LOCAL_RECORD_DETAIL_CHANGED, {
-          recordId: rowId
-        }, updates);
-      }
-    });
-  }, [context.eventBus, modifyRecordAPI]);
-  const closeSettings = (0, _react.useCallback)(() => {
-    setShowSettings(false);
-  }, []);
-  (0, _react.useEffect)(() => {
-    const eventBus = context.eventBus;
-    const unsubscribeCardSetting = eventBus.subscribe(_constants.EVENT_BUS_TYPE.TOGGLE_CARD_SETTINGS, () => setShowSettings(!isShowSettings));
-    const unsubscribeCloseCardSetting = eventBus.subscribe(_constants.EVENT_BUS_TYPE.CLOSE_CARD_SETTINGS, () => setShowSettings(false));
-    return () => {
-      unsubscribeCardSetting();
-      unsubscribeCloseCardSetting();
-    };
-  }, [context, isShowSettings]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "sea-metadata-container"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "sea-metadata-view-card flex-fill o-auto position-relative"
-  }, /*#__PURE__*/_react.default.createElement(_cardItems.default, {
-    modifyRecord: modifyRecord,
-    deleteRecords: deleteRecords,
-    modifyColumnData: modifyColumnData,
-    onCloseSettings: closeSettings
-  })));
-};
-var _default = exports.default = Card;

package/dist/views/card/settings/index.css

@@ -1,68 +0,0 @@
-.sf-metadata-view-card-setting-panel {
-  min-width: 300px;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  border-left: 1px solid var(--bs-border-secondary-color);
-  background: var(--bs-body-bg);
-}
-
-.sf-metadata-view-card-setting-panel .setting-panel-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 10px 16px;
-  border-bottom: 1px solid var(--bs-border-secondary-color);
-}
-
-.sf-metadata-view-card-setting-panel .setting-panel-body {
-  width: 100%;
-  height: 100%;
-  padding: 16px 16px 50px;
-  font-size: 14px;
-  overflow: auto;
-}
-
-.sf-metadata-view-card-setting-panel .setting-panel-body .setting-item {
-  margin-bottom: 14px;
-}
-
-.sf-metadata-view-card-setting-panel .setting-item .setting-item-label {
-  display: inline-block;
-  margin-bottom: 8px;
-}
-
-.sf-metadata-view-card-setting-panel .setting-item .custom-switch-description {
-  margin: 0;
-}
-
-.sf-metadata-view-card-setting-panel .setting-item .switch-setting-item {
-  padding: 0;
-  display: flex;
-  justify-content: space-between;
-}
-
-.sf-metadata-view-card-setting-panel .custom-switch {
-  width: 100%;
-  padding: 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  cursor: pointer;
-}
-
-.sf-metadata-view-card-setting-panel .custom-switch-indicator {
-  border-radius: 6px;
-  height: 12px;
-  width: 22px;
-  margin-right: 8px;
-}
-
-.sf-metadata-view-card-setting-panel .custom-switch .custom-switch-indicator:before {
-  height: 8px;
-  width: 8px;
-}
-
-.sf-metadata-view-card-setting-panel .custom-switch .custom-switch-input:checked~.custom-switch-indicator:before {
-  left: 12px;
-}

package/dist/views/card/settings/index.js

@@ -1,143 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _opIcon = _interopRequireDefault(require("../../../common/components/op-icon"));
-var _switch = _interopRequireDefault(require("../../../common/components/switch"));
-var _fieldDisplaySettings = _interopRequireDefault(require("../../../components/data-process-setter/field-display-settings"));
-var _constants = require("../../../constants");
-var _hooks = require("../../../hooks");
-var _column = require("../../../utils/column");
-var _constants2 = require("../../../../utils/constants");
-require("./index.css");
-const Settings = _ref => {
-  let {
-    columns,
-    columnsMap,
-    settings,
-    modifySettings,
-    onClose
-  } = _ref;
-  const {
-    globalHiddenColumns
-  } = (0, _hooks.useMetadataStatus)();
-  const validColumns = (0, _react.useMemo)(() => columns.filter(column => !globalHiddenColumns.includes(column.key)), [columns, globalHiddenColumns]);
-  const displayColumns = (0, _react.useMemo)(() => {
-    const displayColumnsConfig = settings[_constants.CARD_SETTINGS_KEYS.COLUMNS].filter(column => !globalHiddenColumns.includes(column.key));
-    const nameColumnKey = _constants.PRIVATE_COLUMN_KEY.FILE_NAME;
-    const mtimeColumnKey = _constants.PRIVATE_COLUMN_KEY.FILE_MTIME;
-    const lastModifierColumnKey = _constants.PRIVATE_COLUMN_KEY.FILE_MODIFIER;
-    const filteredColumns = validColumns.filter(item => item.key !== nameColumnKey && item.key !== mtimeColumnKey && item.key !== lastModifierColumnKey);
-    if (!displayColumnsConfig) {
-      return filteredColumns.map(column => ({
-        ...column,
-        shown: false
-      }));
-    }
-    const validDisplayColumnsConfig = displayColumnsConfig.map(columnConfig => {
-      const column = columnsMap[columnConfig.key];
-      if (column) return {
-        ...column,
-        shown: columnConfig.shown
-      };
-      return null;
-    }).filter(column => column && column.key !== nameColumnKey && column.key !== mtimeColumnKey);
-    const addedColumns = filteredColumns.filter(column => !(0, _column.getColumnByKey)(validDisplayColumnsConfig, column.key)).map(column => ({
-      ...column,
-      shown: false
-    }));
-    return [...validDisplayColumnsConfig, ...addedColumns];
-  }, [validColumns, columnsMap, settings, globalHiddenColumns]);
-  const displayColumnsConfig = (0, _react.useMemo)(() => displayColumns.map(column => ({
-    key: column.key,
-    shown: column.shown
-  })), [displayColumns]);
-  const handleUpdateSettings = (0, _react.useCallback)((key, value) => {
-    modifySettings({
-      ...settings,
-      [key]: value
-    });
-  }, [settings, modifySettings]);
-  const onToggleField = (0, _react.useCallback)((key, shown) => {
-    const newDisplayColumnsConfig = displayColumnsConfig.map(columnConfig => {
-      if (columnConfig.key === key) return {
-        ...columnConfig,
-        shown
-      };
-      return columnConfig;
-    });
-    handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.COLUMNS, newDisplayColumnsConfig);
-  }, [displayColumnsConfig, handleUpdateSettings]);
-  const onMoveField = (0, _react.useCallback)((sourceKey, targetKey) => {
-    const newDisplayColumnsConfig = displayColumnsConfig.slice(0);
-    const sourceIndex = displayColumnsConfig.findIndex(columnConfig => columnConfig.key === sourceKey);
-    const targetIndex = displayColumnsConfig.findIndex(columnConfig => columnConfig.key === targetKey);
-    if (sourceIndex === -1 || targetIndex === -1) return;
-    newDisplayColumnsConfig.splice(sourceIndex, 1, displayColumnsConfig[targetIndex]);
-    newDisplayColumnsConfig.splice(targetIndex, 1, displayColumnsConfig[sourceIndex]);
-    handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.COLUMNS, newDisplayColumnsConfig);
-  }, [displayColumnsConfig, handleUpdateSettings]);
-  const onToggleFieldsVisibility = (0, _react.useCallback)(visibility => {
-    const newDisplayColumnsConfig = displayColumnsConfig.map(columnConfig => ({
-      ...columnConfig,
-      shown: visibility
-    }));
-    handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.COLUMNS, newDisplayColumnsConfig);
-  }, [displayColumnsConfig, handleUpdateSettings]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-metadata-view-card-setting-panel"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "setting-panel-header"
-  }, /*#__PURE__*/_react.default.createElement("h5", {
-    className: "m-0"
-  }, (0, _constants2.gettext)('Settings')), /*#__PURE__*/_react.default.createElement(_opIcon.default, {
-    className: "op-icon",
-    symbol: "close",
-    op: onClose,
-    title: (0, _constants2.gettext)('Close')
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "setting-panel-body"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "setting-item"
-  }, /*#__PURE__*/_react.default.createElement(_switch.default, {
-    placeholder: (0, _constants2.gettext)('Don\'t show empty values'),
-    checked: settings[_constants.CARD_SETTINGS_KEYS.HIDE_EMPTY_VALUE] || false,
-    onChange: () => handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.HIDE_EMPTY_VALUE, !settings[_constants.CARD_SETTINGS_KEYS.HIDE_EMPTY_VALUE])
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-metadata-setting-divide-line"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "setting-item"
-  }, /*#__PURE__*/_react.default.createElement(_switch.default, {
-    placeholder: (0, _constants2.gettext)('Show property names'),
-    checked: settings[_constants.CARD_SETTINGS_KEYS.SHOW_COLUMN_NAME] || false,
-    onChange: () => handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.SHOW_COLUMN_NAME, !settings[_constants.CARD_SETTINGS_KEYS.SHOW_COLUMN_NAME])
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-metadata-setting-divide-line"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "setting-item"
-  }, /*#__PURE__*/_react.default.createElement(_switch.default, {
-    placeholder: (0, _constants2.gettext)('Text wraps'),
-    checked: settings[_constants.CARD_SETTINGS_KEYS.TEXT_WRAP] || false,
-    onChange: () => handleUpdateSettings(_constants.CARD_SETTINGS_KEYS.TEXT_WRAP, !settings[_constants.CARD_SETTINGS_KEYS.TEXT_WRAP])
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-metadata-setting-divide-line"
-  }), /*#__PURE__*/_react.default.createElement(_fieldDisplaySettings.default, {
-    fieldIconConfig: _constants.COLUMNS_ICON_CONFIG,
-    fields: displayColumns,
-    textProperties: {
-      titleValue: (0, _constants2.gettext)('Properties to display on the card'),
-      bannerValue: (0, _constants2.gettext)('Properties'),
-      hideValue: (0, _constants2.gettext)('Hide all'),
-      showValue: (0, _constants2.gettext)('Show all')
-    },
-    onToggleField: onToggleField,
-    onMoveField: onMoveField,
-    onToggleFieldsVisibility: onToggleFieldsVisibility
-  })));
-};
-var _default = exports.default = Settings;