nytai commented on a change in pull request #11005:
URL:
https://github.com/apache/incubator-superset/pull/11005#discussion_r494513003
##########
File path: superset-frontend/src/views/CRUD/data/savedquery/SavedQueryList.tsx
##########
@@ -17,28 +17,283 @@
* under the License.
*/
-import React from 'react';
+import { t, styled } from '@superset-ui/core';
+import React, { useMemo } from 'react';
+import {
+ createFetchRelated,
+ createFetchDistinct,
+ createErrorHandler,
+} from 'src/views/CRUD/utils';
+import { Popover } from 'src/common/components';
import withToasts from 'src/messageToasts/enhancers/withToasts';
+import { useListViewResource } from 'src/views/CRUD/hooks';
import SubMenu, { SubMenuProps } from 'src/components/Menu/SubMenu';
+import ListView, { Filters } from 'src/components/ListView';
+import TooltipWrapper from 'src/components/TooltipWrapper';
+import Icon from 'src/components/Icon';
import { commonMenuData } from 'src/views/CRUD/data/common';
+const PAGE_SIZE = 25;
+
interface SavedQueryListProps {
addDangerToast: (msg: string) => void;
addSuccessToast: (msg: string) => void;
}
+type SavedQueryObject = {};
+
+const StyledTableLabel = styled.div`
+ .count {
+ margin-left: 5px;
+ color: ${({ theme }) => theme.colors.primary.base};
+ text-decoration: underline;
+ cursor: pointer;
+ }
+`;
+
+const StyledPopoverItem = styled.div`
+ color: ${({ theme }) => theme.colors.grayscale.dark2};
+`;
+
function SavedQueryList({
addDangerToast,
addSuccessToast,
}: SavedQueryListProps) {
+ const {
+ state: { loading, resourceCount: queryCount, resourceCollection: queries },
+ hasPerm,
+ fetchData,
+ // refreshData, //TODO: add back later when editing?
+ } = useListViewResource<SavedQueryObject>(
+ 'saved_query',
+ t('saved_queries'),
+ addDangerToast,
+ );
+
+ const canCreate = hasPerm('can_add');
+ const canEdit = hasPerm('can_edit');
+ const canDelete = hasPerm('can_delete');
+
const menuData: SubMenuProps = {
activeChild: 'Saved Queries',
...commonMenuData,
};
+ const initialSort = [{ id: 'label', desc: true }];
+ const columns = useMemo(
+ () => [
+ {
+ accessor: 'label',
+ Header: t('Name'),
+ },
+ {
+ accessor: 'database.database_name',
+ Header: t('Database'),
+ },
+ {
+ accessor: 'database',
+ hidden: true,
+ disableSortBy: true,
+ },
+ {
+ accessor: 'schema',
+ Header: t('Schema'),
+ },
+ {
+ Cell: ({
+ row: {
+ original: { sql_tables: tables },
+ },
+ }: any) => {
+ const names = tables.map((table: any) => table.table);
+ const main = names.shift();
+
+ if (names.length) {
+ return (
+ <StyledTableLabel>
+ <span>{main}</span>
+ <Popover
+ placement="right"
+ title={t('TABLES')}
+ trigger="click"
+ content={
+ <>
+ {names.map((name: string) => (
+ <StyledPopoverItem>{name}</StyledPopoverItem>
+ ))}
+ </>
+ }
+ >
+ <span className="count">(+{names.length})</span>
+ </Popover>
+ </StyledTableLabel>
+ );
+ }
+
+ return main;
+ },
+ accessor: 'sql_tables',
+ Header: t('Tables'),
+ disableSortBy: true,
+ },
+ {
+ Cell: ({
+ row: {
+ original: { created_on: createdOn },
+ },
+ }: any) => createdOn,
+ Header: t('Created On'),
+ accessor: 'created_on',
+ },
+ {
+ Cell: ({
+ row: {
+ original: { changed_on_delta_humanized: changedOn },
+ },
+ }: any) => changedOn,
+ Header: t('Modified'),
+ accessor: 'changed_on_delta_humanized',
+ },
+ {
+ Cell: ({ row: { original } }: any) => {
+ const handlePreview = () => {}; // openQueryPreviewModal(original);
// TODO: open preview modal
+ const handleEdit = () => {}; // handleQueryEdit(original); // TODO:
navigate to sql editor with selected query open
+ const handleCopy = () => {}; // TODO: copy link to clipboard
+ const handleDelete = () => {}; // openQueryDeleteModal(original);
+
+ return (
+ <span className="actions">
+ <TooltipWrapper
+ label="preview-action"
+ tooltip={t('Query preview')}
+ placement="bottom"
+ >
+ <span
+ role="button"
+ tabIndex={0}
+ className="action-button"
+ onClick={handlePreview}
+ >
+ <Icon name="binoculars" />
+ </span>
+ </TooltipWrapper>
+ {canEdit && (
+ <TooltipWrapper
+ label="edit-action"
+ tooltip={t('Edit query')}
+ placement="bottom"
+ >
+ <span
+ role="button"
+ tabIndex={0}
+ className="action-button"
+ onClick={handleEdit}
+ >
+ <Icon name="pencil" />
+ </span>
+ </TooltipWrapper>
+ )}
+ <TooltipWrapper
+ label="copy-action"
+ tooltip={t('Copy query URL')}
+ placement="bottom"
+ >
+ <span
+ role="button"
+ tabIndex={0}
+ className="action-button"
+ onClick={handleCopy}
+ >
+ <Icon name="clipboard" />
+ </span>
+ </TooltipWrapper>
+ {canDelete && (
+ <span
+ role="button"
+ tabIndex={0}
+ className="action-button"
+ data-test="database-delete"
+ onClick={handleDelete}
+ >
+ <TooltipWrapper
+ label="delete-action"
+ tooltip={t('Delete query')}
+ placement="bottom"
+ >
+ <Icon name="trash" />
+ </TooltipWrapper>
+ </span>
+ )}
+ </span>
+ );
+ },
+ Header: t('Actions'),
+ id: 'actions',
+ disableSortBy: true,
+ },
+ ],
+ [canDelete, canCreate],
+ );
+
+ const filters: Filters = useMemo(
+ () => [
+ {
+ Header: t('Database'),
+ id: 'database',
+ input: 'select',
+ operator: 'rel_o_m',
+ unfilteredLabel: 'All',
+ fetchSelects: createFetchRelated(
+ 'saved_query',
+ 'database',
+ createErrorHandler(errMsg =>
+ t(
+ 'An error occurred while fetching dataset datasource values: %s',
+ errMsg,
+ ),
+ ),
+ ),
+ paginate: true,
+ },
+ {
+ Header: t('Schema'),
+ id: 'schema',
+ input: 'select',
+ operator: 'eq',
+ unfilteredLabel: 'All',
+ fetchSelects: createFetchDistinct(
+ 'saved_query',
+ 'schema',
+ createErrorHandler(errMsg =>
+ t('An error occurred while fetching schema values: %s', errMsg),
+ ),
+ ),
+ paginate: true,
+ },
+ {
+ Header: t('Search'),
+ id: 'label',
+ input: 'search',
+ operator: 'ct',
Review comment:
since https://github.com/apache/incubator-superset/pull/11031 just
merged, can you rebase and switch this to `all_text` ?
##########
File path: superset-frontend/src/components/Icon/index.tsx
##########
@@ -17,6 +17,7 @@
* under the License.
*/
import React, { SVGProps } from 'react';
+import { ReactComponent as BinocularsIcon } from 'images/icons/binoculars.svg';
Review comment:
These icon additions may conflict with
https://github.com/apache/incubator-superset/pull/11033 so we should probably
coordinte with @rusackas
##########
File path: superset-frontend/src/components/Icon/index.tsx
##########
@@ -17,6 +17,7 @@
* under the License.
*/
import React, { SVGProps } from 'react';
+import { ReactComponent as BinocularsIcon } from 'images/icons/binoculars.svg';
Review comment:
These icon additions may conflict with
https://github.com/apache/incubator-superset/pull/11033 so we should probably
coordinte with @rusackas in this area
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
