dashboards.map(c => c.id), [dashboards]);
const [saveFavoriteStatus, favoriteStatus] = useFavoriteStatus(
@@ -83,10 +86,9 @@ function DashboardTable({
);
};
- const getFilters = () => {
+ const getFilters = (filterName: string) => {
const filters = [];
-
- if (dashboardFilter === 'Mine') {
+ if (filterName === 'Mine') {
filters.push({
id: 'owners',
operator: 'rel_m_m',
@@ -110,8 +112,8 @@ function DashboardTable({
});
}
- useEffect(() => {
- fetchData({
+ const getData = (filter: string) => {
+ return fetchData({
pageIndex: 0,
pageSize: PAGE_SIZE,
sortBy: [
@@ -120,9 +122,9 @@ function DashboardTable({
desc: true,
},
],
- filters: getFilters(),
+ filters: getFilters(filter),
});
- }, [dashboardFilter]);
+ };
return (
<>
@@ -132,12 +134,16 @@ function DashboardTable({
{
name: 'Favorite',
label: t('Favorite'),
- onClick: () => setDashboardFilter('Favorite'),
+ onClick: () => {
+ getData('Favorite').then(() => setDashboardFilter('Favorite'));
+ },
},
{
name: 'Mine',
label: t('Mine'),
- onClick: () => setDashboardFilter('Mine'),
+ onClick: () => {
+ getData('Mine').then(() => setDashboardFilter('Mine'));
+ },
},
]}
buttons={[
@@ -169,24 +175,30 @@ function DashboardTable({
onSubmit={handleDashboardEdit}
/>
)}
- {dashboards.length > 0 ? (
+ {dashboards.length > 0 && (
{dashboards.map(e => (
setEditModal(dashboard)}
+ openDashboardEditModal={(dashboard: Dashboard) =>
+ setEditModal(dashboard)
+ }
saveFavoriteStatus={saveFavoriteStatus}
favoriteStatus={favoriteStatus[e.id]}
/>
))}
- ) : (
+ )}
+ {dashboards.length === 0 && (
)}
>
diff --git a/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx b/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx
index f145dfe79c..045ce7152b 100644
--- a/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx
+++ b/superset-frontend/src/views/CRUD/welcome/EmptyState.tsx
@@ -27,7 +27,9 @@ interface EmptyStateProps {
tableName: string;
tab?: string;
}
-
+const EmptyContainer = styled.div`
+ min-height: 200px;
+`;
const ButtonContainer = styled.div`
Button {
svg {
@@ -48,10 +50,10 @@ export default function EmptyState({ tableName, tab }: EmptyStateProps) {
SAVED_QUERIES: '/savedqueryview/list/',
};
const tableIcon = {
- RECENTS: 'union.png',
- DASHBOARDS: 'empty-dashboard.png',
- CHARTS: 'empty-charts.png',
- SAVED_QUERIES: 'empty-queries.png',
+ RECENTS: 'union.svg',
+ DASHBOARDS: 'empty-dashboard.svg',
+ CHARTS: 'empty-charts.svg',
+ SAVED_QUERIES: 'empty-queries.svg',
};
const mine = (
{`No ${
@@ -90,55 +92,59 @@ export default function EmptyState({ tableName, tab }: EmptyStateProps) {
// Mine and Recent Activity(all tabs) tab empty state
if (tab === 'Mine' || tableName === 'RECENTS') {
return (
-
- {tableName !== 'RECENTS' && (
-
-
+
+ )}
+
+
);
}
// Favorite tab empty state
return (
-
- {t("You don't have any favorites yet!")}
-
- }
- >
- {
- window.location = favRedirects[tableName];
- }}
+
+
+ {t("You don't have any favorites yet!")}
+
+ }
>
- SEE ALL{' '}
- {tableName === 'SAVED_QUERIES'
- ? t('SQL LAB QUERIES')
- : t(`${tableName}`)}
-
-
+ {
+ window.location = favRedirects[tableName];
+ }}
+ >
+ SEE ALL{' '}
+ {tableName === 'SAVED_QUERIES'
+ ? t('SQL LAB QUERIES')
+ : t(`${tableName}`)}
+
+
+
);
}
diff --git a/superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx b/superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx
index f7b65094a5..6de2f3c8e4 100644
--- a/superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx
+++ b/superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
import { t, SupersetClient, styled } from '@superset-ui/core';
import withToasts from 'src/messageToasts/enhancers/withToasts';
import { Dropdown, Menu } from 'src/common/components';
@@ -26,8 +26,12 @@ import DeleteModal from 'src/components/DeleteModal';
import Icon from 'src/components/Icon';
import SubMenu from 'src/components/Menu/SubMenu';
import EmptyState from './EmptyState';
-
-import { IconContainer, CardContainer, createErrorHandler } from '../utils';
+import {
+ IconContainer,
+ CardContainer,
+ createErrorHandler,
+ CardStyles,
+} from '../utils';
const PAGE_SIZE = 3;
@@ -50,6 +54,7 @@ interface SavedQueriesProps {
queryFilter: string;
addDangerToast: (arg0: string) => void;
addSuccessToast: (arg0: string) => void;
+ mine: Array;
}
const QueryData = styled.div`
@@ -59,7 +64,7 @@ const QueryData = styled.div`
border-bottom: 1px solid ${({ theme }) => theme.colors.grayscale.light2};
.title {
font-weight: ${({ theme }) => theme.typography.weights.normal};
- color: ${({ theme }) => theme.colors.grayscale.light2};
+ color: ${({ theme }) => theme.colors.grayscale.light1};
}
.holder {
margin: ${({ theme }) => theme.gridUnit * 2}px;
@@ -69,17 +74,24 @@ const SavedQueries = ({
user,
addDangerToast,
addSuccessToast,
+ mine,
}: SavedQueriesProps) => {
const {
- state: { loading, resourceCollection: queries },
+ state: { resourceCollection: queries },
hasPerm,
fetchData,
refreshData,
- } = useListViewResource('saved_query', t('query'), addDangerToast);
+ } = useListViewResource(
+ 'saved_query',
+ t('query'),
+ addDangerToast,
+ true,
+ mine,
+ );
const [queryFilter, setQueryFilter] = useState('Mine');
const [queryDeleteModal, setQueryDeleteModal] = useState(false);
const [currentlyEdited, setCurrentlyEdited] = useState({});
-
+ const [ifMine, setMine] = useState(true);
const canEdit = hasPerm('can_edit');
const canDelete = hasPerm('can_delete');
@@ -88,7 +100,27 @@ const SavedQueries = ({
endpoint: `/api/v1/saved_query/${id}`,
}).then(
() => {
- refreshData();
+ const queryParams = {
+ filters: [
+ {
+ id: 'created_by',
+ operator: 'rel_o_m',
+ value: `${user?.userId}`,
+ },
+ ],
+ pageSize: PAGE_SIZE,
+ sortBy: [
+ {
+ id: 'changed_on_delta_humanized',
+ desc: true,
+ },
+ ],
+ pageIndex: 0,
+ };
+ // if mine is default there refresh data with current filters
+ const filter = ifMine ? queryParams : undefined;
+ refreshData(filter);
+ setMine(false);
setQueryDeleteModal(false);
addSuccessToast(t('Deleted: %s', label));
},
@@ -98,9 +130,9 @@ const SavedQueries = ({
);
};
- const getFilters = () => {
+ const getFilters = (filterName: string) => {
const filters = [];
- if (queryFilter === 'Mine') {
+ if (filterName === 'Mine') {
filters.push({
id: 'created_by',
operator: 'rel_o_m',
@@ -116,8 +148,8 @@ const SavedQueries = ({
return filters;
};
- useEffect(() => {
- fetchData({
+ const getData = (filter: string) => {
+ return fetchData({
pageIndex: 0,
pageSize: PAGE_SIZE,
sortBy: [
@@ -126,9 +158,9 @@ const SavedQueries = ({
desc: true,
},
],
- filters: getFilters(),
+ filters: getFilters(filter),
});
- }, [queryFilter]);
+ };
const renderMenu = (query: Query) => (