kgabryje commented on code in PR #32548:
URL: https://github.com/apache/superset/pull/32548#discussion_r2027497187
##########
superset-frontend/src/explore/components/DatasourcePanel/DatasourcePanelItem.tsx:
##########
@@ -123,146 +76,95 @@ const SectionHeaderButton = styled.button`
border: none;
background: transparent;
width: 100%;
- padding-inline: 0px;
+ height: 100%;
+ padding-inline: 0;
`;
const SectionHeader = styled.span`
- ${({ theme }) => `
+ ${({ theme }) => css`
+ color: ${theme.colors.grayscale.dark1};
font-size: ${theme.typography.sizes.m}px;
+ font-weight: ${theme.typography.weights.medium};
line-height: 1.3;
`}
`;
-const Box = styled.div`
- ${({ theme }) => `
- border: 1px ${theme.colors.grayscale.light4} solid;
- border-radius: ${theme.gridUnit}px;
- font-size: ${theme.typography.sizes.s}px;
- padding: ${theme.gridUnit}px;
- color: ${theme.colors.grayscale.light1};
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
+const Divider = styled.div`
+ ${({ theme }) => css`
+ height: 16px;
+ border-bottom: 1px solid ${theme.colors.grayscale.light3};
`}
`;
-const DatasourcePanelItem: FC<Props> = ({ index, style, data }) => {
- const {
- metricSlice: _metricSlice,
- columnSlice,
- totalMetrics,
- totalColumns,
- width,
- showAllMetrics,
- onShowAllMetricsChange,
- showAllColumns,
- onShowAllColumnsChange,
- collapseMetrics,
- onCollapseMetricsChange,
- collapseColumns,
- onCollapseColumnsChange,
- hiddenMetricCount,
- hiddenColumnCount,
- } = data;
- const metricSlice = collapseMetrics ? [] : _metricSlice;
-
- const EXTRA_LINES = collapseMetrics ? 1 : 2;
- const isColumnSection = collapseMetrics
- ? index >= 1
- : index > metricSlice.length + EXTRA_LINES;
- const HEADER_LINE = isColumnSection
- ? metricSlice.length + EXTRA_LINES + 1
- : 0;
- const SUBTITLE_LINE = HEADER_LINE + 1;
- const BOTTOM_LINE =
- (isColumnSection ? columnSlice.length : metricSlice.length) +
- (collapseMetrics ? HEADER_LINE : SUBTITLE_LINE) +
- 1;
- const collapsed = isColumnSection ? collapseColumns : collapseMetrics;
- const setCollapse = isColumnSection
- ? onCollapseColumnsChange
- : onCollapseMetricsChange;
- const showAll = isColumnSection ? showAllColumns : showAllMetrics;
- const setShowAll = isColumnSection
- ? onShowAllColumnsChange
- : onShowAllMetricsChange;
+export interface DatasourcePanelItemProps {
+ index: number;
+ style: CSSProperties;
+ data: {
+ flattenedItems: FlattenedItem[];
+ folderMap: Map<string, Folder>;
+ width: number;
+ onToggleCollapse: (folderId: string) => void;
+ };
+}
+
+const DatasourcePanelItem = ({
+ index,
+ style,
+ data,
+}: DatasourcePanelItemProps) => {
+ const { flattenedItems, folderMap, width, onToggleCollapse } = data;
+ const item = flattenedItems[index];
const theme = useTheme();
- const hiddenCount = isColumnSection ? hiddenColumnCount : hiddenMetricCount;
+
+ if (!item) return null;
+
+ const folder = folderMap.get(item.folderId);
+ if (!folder) return null;
+
+ const indentation = item.depth * theme.gridUnit * 4;
return (
<div
- style={style}
- css={css`
- padding: 0 ${theme.gridUnit * 4}px;
- `}
+ style={{
+ ...style,
+ paddingLeft: theme.gridUnit * 4 + indentation,
+ paddingRight: theme.gridUnit * 4,
+ }}
>
- {index === HEADER_LINE && (
- <SectionHeaderButton onClick={() => setCollapse(!collapsed)}>
- <SectionHeader>
- {isColumnSection ? t('Columns') : t('Metrics')}
- </SectionHeader>
- {collapsed ? (
+ {item.type === 'header' && (
+ <SectionHeaderButton onClick={() => onToggleCollapse(folder.id)}>
+ <SectionHeader>{folder.name}</SectionHeader>
+ {folder.isCollapsed ? (
<Icons.DownOutlined iconSize="s" />
) : (
<Icons.UpOutlined iconSize="s" />
)}
</SectionHeaderButton>
)}
- {index === SUBTITLE_LINE && !collapsed && (
- <div
- css={css`
- display: flex;
- gap: ${theme.gridUnit * 2}px;
- justify-content: space-between;
- align-items: baseline;
- `}
- >
- <div
- className="field-length"
- css={css`
- flex-shrink: 0;
- `}
- >
- {isColumnSection
- ? t(`Showing %s of %s`, columnSlice?.length, totalColumns)
Review Comment:
@justinpark If I understand correctly, this line was displayed because we
limited the initially displayed items to 50. I removed that because I don't
think it had any value given that we use virtualization.
Could you explain what do you mean by `the count for items not included in
the folder`? Would a simple items count for each folder be sufficient for your
users?
--
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.
To unsubscribe, e-mail: notifications-unsubscr...@superset.apache.org
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscr...@superset.apache.org
For additional commands, e-mail: notifications-h...@superset.apache.org
