Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(datasets): Replace left panel layout by TableSelector #24599

Merged
merged 9 commits into from
Jul 20, 2023
Merged

fix(datasets): Replace left panel layout by TableSelector #24599

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
fbf9952
fix(datasets): Replace left panel layout by TableSelector
Jul 5, 2023
b443f8b
spec update for new table selector
Jul 6, 2023
d3af5d6
Add warning indicator using customLabel renderder
Jul 7, 2023
f3f14c0
restore warning icon test spec
Jul 7, 2023
4b0f598
adjust margin right for warning icon
Jul 7, 2023
478db72
remove bottom margin on tooltip
Jul 11, 2023
ac85e6b
configurable marginRight on warning icon
justinpark Jul 13, 2023
3c0c210
remove redundant join/split
justinpark Jul 20, 2023
e5e0358
replace to marginRight
justinpark Jul 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 7 additions & 1 deletion superset-frontend/src/components/TableSelector/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@ interface TableSelectorProps {
tableValue?: string | string[];
onTableSelectChange?: (value?: string | string[], schema?: string) => void;
tableSelectMode?: 'single' | 'multiple';
customTableOptionLabelRenderer?: (table: Table) => JSX.Element;
}

export interface TableOption {
Expand Down Expand Up @@ -132,6 +133,7 @@ export const TableOption = ({ table }: { table: Table }) => {
<WarningIconWithTooltip
warningMarkdown={extra.warning_markdown}
size="l"
marginRight={4}
/>
)}
{value}
Expand Down Expand Up @@ -164,6 +166,7 @@ const TableSelector: FunctionComponent<TableSelectorProps> = ({
tableSelectMode = 'single',
tableValue = undefined,
onTableSelectChange,
customTableOptionLabelRenderer,
}) => {
const { addSuccessToast } = useToasts();
const [currentSchema, setCurrentSchema] = useState<string | undefined>(
Expand Down Expand Up @@ -203,9 +206,12 @@ const TableSelector: FunctionComponent<TableSelectorProps> = ({
value: table.value,
label: <TableOption table={table} />,
text: table.value,
...(customTableOptionLabelRenderer && {
customLabel: customTableOptionLabelRenderer(table),
}),
}))
: [],
[data],
[data, customTableOptionLabelRenderer],
);

useEffect(() => {
Expand Down
3 changes: 3 additions & 0 deletions superset-frontend/src/components/Tooltip/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,9 @@ export const Tooltip = (props: TooltipProps) => {
display: block;
}
}
.ant-tooltip-inner > p {
margin: 0;
}
`}
/>
<AntdTooltip
Expand Down
4 changes: 3 additions & 1 deletion superset-frontend/src/components/WarningIconWithTooltip/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,13 @@ import { Tooltip } from 'src/components/Tooltip';
export interface WarningIconWithTooltipProps {
warningMarkdown: string;
size?: IconType['iconSize'];
marginRight?: number;
}

function WarningIconWithTooltip({
warningMarkdown,
size,
marginRight,
}: WarningIconWithTooltipProps) {
const theme = useTheme();
return (
Expand All @@ -39,7 +41,7 @@ function WarningIconWithTooltip({
<Icons.AlertSolid
iconColor={theme.colors.alert.base}
iconSize={size}
css={{ marginRight: theme.gridUnit * 2 }}
css={{ marginRight: marginRight ?? theme.gridUnit * 2 }}
/>
</Tooltip>
);
Expand Down
Loading