Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

ripped list header in favor of taliwind

This commit is contained in:
Nate Kelley 2025-03-01 11:49:56 -07:00
parent 89ed75541e
commit 7b0dec266b
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
2 changed files with 16 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
web/src/components/ui/list/BusterList/BusterListHeader.tsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import { BusterListColumn } from './interfaces'; import { BusterListColumn } from './interfaces';
import { CheckboxColumn } from './CheckboxColumn'; import { CheckboxColumn } from './CheckboxColumn';
import { Text } from '@/components/ui'; import { Text } from '@/components/ui';
import { createStyles } from 'antd-style'; import { cn } from '@/lib/classMerge';
import { HEIGHT_OF_HEADER } from './config'; import { HEIGHT_OF_HEADER } from './config';
export const BusterListHeader: React.FC<{ export const BusterListHeader: React.FC<{
@ -21,21 +21,28 @@ export const BusterListHeader: React.FC<{
globalCheckStatus, globalCheckStatus,
rowsLength rowsLength
}) => { }) => {
const { styles, cx } = useStyles();
const showCheckboxColumn = !!onGlobalSelectChange; const showCheckboxColumn = !!onGlobalSelectChange;
const showGlobalCheckbox = const showGlobalCheckbox =
globalCheckStatus === 'indeterminate' || globalCheckStatus === 'checked'; globalCheckStatus === 'indeterminate' || globalCheckStatus === 'checked';
return ( return (
<div <div
className={cx(styles.header, 'group', rowClassName, 'pr-6', { className={cn(
'pl-3.5': !onGlobalSelectChange 'group border-border flex items-center justify-start border-b pr-6',
})}> {
'pl-3.5': !onGlobalSelectChange
},
rowClassName
)}
style={{
height: `${HEIGHT_OF_HEADER}px`,
minHeight: `${HEIGHT_OF_HEADER}px`
}}>
{showCheckboxColumn && ( {showCheckboxColumn && (
<CheckboxColumn <CheckboxColumn
checkStatus={globalCheckStatus} checkStatus={globalCheckStatus}
onChange={onGlobalSelectChange} onChange={onGlobalSelectChange}
className={cx({ className={cn({
'opacity-100': showGlobalCheckbox, 'opacity-100': showGlobalCheckbox,
'invisible!': rowsLength === 0, 'invisible!': rowsLength === 0,
'pointer-events-none invisible!': !showSelectAll 'pointer-events-none invisible!': !showSelectAll
@ -45,7 +52,7 @@ export const BusterListHeader: React.FC<{
{columns.map((column, index) => ( {columns.map((column, index) => (
<div <div
className={cx('header-cell flex items-center')} className="header-cell flex h-full items-center p-0"
key={column.dataIndex} key={column.dataIndex}
style={{ style={{
width: column.width || '100%', width: column.width || '100%',
@ -66,24 +73,3 @@ export const BusterListHeader: React.FC<{
} }
); );
BusterListHeader.displayName = 'BusterListHeader'; BusterListHeader.displayName = 'BusterListHeader';
const useStyles = createStyles(({ token, css }) => ({
header: css`
height: ${HEIGHT_OF_HEADER}px;
min-height: ${HEIGHT_OF_HEADER}px;
display: flex;
align-items: center;
justify-content: flex-start;
border-bottom: 0.5px solid ${token.colorBorder};
.header-cell {
padding: 0 0px;
height: 100%;
// &:first-child {
// padding-left: 18px;
// }
}
`
}));

2
web/src/components/ui/list/BusterList/BusterListVirtua.tsx
View File

@ -1,3 +1,5 @@
'use client';
import { VList } from 'virtua'; import { VList } from 'virtua';
import React, { useEffect, useMemo, useRef } from 'react'; import React, { useEffect, useMemo, useRef } from 'react';
import { BusterListProps } from './interfaces'; import { BusterListProps } from './interfaces';