mirror of
https://github.com/dbeaver/cloudbeaver.git
synced 2026-09-24 16:04:36 +08:00
dbeaver/pro#8274 feat: add key icons for key columns in data editor (#4283)
* dbeaver/pro#8274 feat: add key icons for key columns in data editor * dbeaver/pro#8274 feat: change key icon. put to core --------- Co-authored-by: Evgenia <139753579+EvgeniaBzzz@users.noreply.github.com>
This commit is contained in:
Sychev Andrey
@@ -0,0 +1,15 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<defs>
|
||||
<polygon id="path-1" points="0.0004 -0.0001 30.357 -0.0001 30.357 13.6607 0.0004 13.6607"></polygon>
|
||||
</defs>
|
||||
<g id="key" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Page-1" transform="translate(1.000000, 9.000000)">
|
||||
<mask id="mask-2" fill="white">
|
||||
<use xlink:href="#path-1"></use>
|
||||
</mask>
|
||||
<g id="Clip-2"></g>
|
||||
<path d="M6.8304,4.5537 C5.5734,4.5537 4.5534,5.5727 4.5534,6.8307 C4.5534,8.0877 5.5734,9.1077 6.8304,9.1077 C8.0874,9.1077 9.1074,8.0877 9.1074,6.8307 C9.1074,5.5727 8.0874,4.5537 6.8304,4.5537 M6.8304,-0.0003 C9.8054,-0.0003 12.3404,1.8977 13.2664,4.5537 L30.3574,4.5537 L30.3574,9.1077 L27.3214,9.1077 L27.3214,13.6607 L24.2864,13.6607 L24.2864,9.1077 L21.2504,9.1077 L21.2504,13.6607 L18.1114,13.6607 L18.1114,9.1077 L13.2664,9.1077 C12.3404,11.7637 9.8054,13.6607 6.8304,13.6607 C3.0354,13.6607 0.0004,10.6247 0.0004,6.8307 C0.0004,3.0357 3.0354,-0.0003 6.8304,-0.0003" id="Fill-1" fill="#FF9900" mask="url(#mask-2)"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
+5
@@ -26,6 +26,11 @@
|
||||
height: 16px;
|
||||
display: block;
|
||||
}
|
||||
.keyImage {
|
||||
flex-shrink: 0;
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
.name {
|
||||
font-weight: 400;
|
||||
flex-grow: 1;
|
||||
|
||||
+20
-1
@@ -9,7 +9,7 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useContext } from 'react';
|
||||
import { clsx } from '@dbeaver/ui-kit';
|
||||
|
||||
import { getComputed, s, StaticImage, useS } from '@cloudbeaver/core-blocks';
|
||||
import { getComputed, s, StaticImage, useS, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { isResultSetDataSource } from '@cloudbeaver/plugin-data-viewer';
|
||||
|
||||
import { ColumnDnDContext } from '../ColumnDnDContext.js';
|
||||
@@ -31,6 +31,7 @@ export const TableColumnHeader = observer<Props>(function TableColumnHeader({ co
|
||||
const gridSelectionContext = useContext(DataGridSelectionContext);
|
||||
const columnDnDContext = useContext(ColumnDnDContext);
|
||||
const styles = useS(style);
|
||||
const translate = useTranslate();
|
||||
|
||||
const resultIndex = dataGridContext.resultIndex;
|
||||
const model = dataGridContext.model;
|
||||
@@ -55,9 +56,14 @@ export const TableColumnHeader = observer<Props>(function TableColumnHeader({ co
|
||||
const source = model.source;
|
||||
return isResultSetDataSource(source) ? source.hasElementIdentifier(resultIndex) : false;
|
||||
});
|
||||
const rowIdentifierInfo = getComputed(() => {
|
||||
const source = model.source;
|
||||
return isResultSetDataSource(source) ? source.getRowIdentifierInfo(resultIndex) : null;
|
||||
});
|
||||
|
||||
let icon: string | undefined;
|
||||
let columnName: string | undefined;
|
||||
let columnRawName: string | undefined;
|
||||
let columnReadOnly = false;
|
||||
let columnTooltip: string | undefined;
|
||||
let columnDescription: string | undefined;
|
||||
@@ -68,6 +74,7 @@ export const TableColumnHeader = observer<Props>(function TableColumnHeader({ co
|
||||
|
||||
if (column) {
|
||||
columnName = column.label!;
|
||||
columnRawName = column.name ?? undefined;
|
||||
columnDescription = column.description;
|
||||
icon = column.icon;
|
||||
columnReadOnly ||= tableDataContext.format.isReadOnly({ column: columnInfo.key });
|
||||
@@ -84,6 +91,17 @@ export const TableColumnHeader = observer<Props>(function TableColumnHeader({ co
|
||||
}
|
||||
}
|
||||
|
||||
const isKeyColumn = getComputed(() => {
|
||||
const identifier = rowIdentifierInfo?.identifier;
|
||||
if (!identifier || !columnRawName) {
|
||||
return false;
|
||||
}
|
||||
return identifier.attributes.some(attr => attr.name === columnRawName);
|
||||
});
|
||||
const keyTooltip = isKeyColumn
|
||||
? translate(rowIdentifierInfo?.state === 'VIRTUAL_KEY' ? 'data_grid_table_virtual_key_tooltip' : 'data_grid_table_key_column_tooltip')
|
||||
: undefined;
|
||||
|
||||
function handleClick(event: React.MouseEvent<HTMLDivElement>) {
|
||||
gridSelectionContext.selectColumn(colIdx, event.ctrlKey || event.metaKey);
|
||||
dataGridContext.focus();
|
||||
@@ -115,6 +133,7 @@ export const TableColumnHeader = observer<Props>(function TableColumnHeader({ co
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{isKeyColumn && <StaticImage icon="/icons/key.svg" className={s(styles, { keyImage: true })} title={keyTooltip} />}
|
||||
<div className={s(styles, { name: true }, 'tw:truncate')}>{columnName}</div>
|
||||
</div>
|
||||
{tableDataContext.hasDescription && columnDescription && (
|
||||
|
||||
@@ -27,6 +27,7 @@ export default [
|
||||
['data_grid_table_readonly_connection_tooltip', 'Schreibgeschützte Verbindung'],
|
||||
['data_grid_table_no_key_found_tooltip', 'Kein eindeutiger Schlüssel gefunden. Datenänderung nicht möglich.'],
|
||||
['data_grid_table_virtual_key_tooltip', 'Virtueller Schlüssel'],
|
||||
['data_grid_table_key_column_tooltip', 'Schlüsselspalte'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Tabellenpräsentation deaktivieren'],
|
||||
['plugin_data_spreadsheet_new_settings_disable_description', 'Deaktivieren Sie die Tabellenpräsentation von Daten für alle Benutzer'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Show columns description'],
|
||||
|
||||
@@ -33,6 +33,7 @@ export default [
|
||||
['data_grid_table_readonly_connection_tooltip', 'Read-only connection'],
|
||||
['data_grid_table_no_key_found_tooltip', 'No unique key was found. Data modification is not possible.'],
|
||||
['data_grid_table_virtual_key_tooltip', 'Virtual key'],
|
||||
['data_grid_table_key_column_tooltip', 'Key column'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Disable Table presentation'],
|
||||
['plugin_data_spreadsheet_new_settings_disable_description', 'Disable table presentation of data for all users'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Show columns description'],
|
||||
|
||||
@@ -32,6 +32,7 @@ export default [
|
||||
['data_grid_table_index_column_tooltip', 'Sélectionner toute la table'],
|
||||
['data_grid_table_no_key_found_tooltip', "Aucune clé unique n'a été trouvée. La modification des données n'est pas possible."],
|
||||
['data_grid_table_virtual_key_tooltip', 'Clé virtuelle'],
|
||||
['data_grid_table_key_column_tooltip', 'Colonne clé'],
|
||||
['data_grid_table_readonly_connection_tooltip', 'Connexion en lecture seule'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Désactiver la présentation de la table'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Show columns description'],
|
||||
|
||||
@@ -32,6 +32,7 @@ export default [
|
||||
['data_grid_table_readonly_connection_tooltip', 'Connessione in sola lettura'],
|
||||
['data_grid_table_no_key_found_tooltip', 'Nessuna chiave univoca è stata trovata. La modifica dei dati non è possibile.'],
|
||||
['data_grid_table_virtual_key_tooltip', 'Chiave virtuale'],
|
||||
['data_grid_table_key_column_tooltip', 'Colonna chiave'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Disabilita la presentazione della tabella'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Mostra la descrizione delle colonne'],
|
||||
[
|
||||
|
||||
@@ -33,6 +33,7 @@ export default [
|
||||
['data_grid_table_readonly_connection_tooltip', 'Подключение только для чтения'],
|
||||
['data_grid_table_no_key_found_tooltip', 'Не найден уникальный ключ. Изменение данных невозможно.'],
|
||||
['data_grid_table_virtual_key_tooltip', 'Виртуальный ключ'],
|
||||
['data_grid_table_key_column_tooltip', 'Ключевая колонка'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Отключить табличное представление'],
|
||||
['plugin_data_spreadsheet_new_settings_disable_description', 'Отключить табличное представление данных для всех пользователей'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Показать описание колонки'],
|
||||
|
||||
@@ -33,6 +33,7 @@ export default [
|
||||
['data_grid_table_readonly_connection_tooltip', 'Kết nối chỉ đọc'],
|
||||
['data_grid_table_no_key_found_tooltip', 'Không tìm thấy khóa duy nhất. Không thể sửa đổi dữ liệu.'],
|
||||
['data_grid_table_virtual_key_tooltip', 'Khóa ảo'],
|
||||
['data_grid_table_key_column_tooltip', 'Cột khóa'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', 'Tắt chế độ hiển thị dạng bảng'],
|
||||
['plugin_data_spreadsheet_new_settings_disable_description', 'Tắt chế độ hiển thị dữ liệu dạng bảng cho tất cả người dùng'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', 'Hiển thị mô tả cột'],
|
||||
|
||||
@@ -32,6 +32,7 @@ export default [
|
||||
['data_grid_table_index_column_tooltip', '选择整个表'],
|
||||
['data_grid_table_no_key_found_tooltip', '未找到唯一键。无法修改数据。'],
|
||||
['data_grid_table_virtual_key_tooltip', '虚拟键'],
|
||||
['data_grid_table_key_column_tooltip', '键列'],
|
||||
['data_grid_table_readonly_connection_tooltip', '只读连接'],
|
||||
['plugin_data_spreadsheet_new_settings_disable', '禁用表显示'],
|
||||
['plugin_data_spreadsheet_new_settings_description_label', '显示列描述'],
|
||||
|
||||
Reference in New Issue
Block a user