fix: show bottom border on the list header when no tab bar follows
192 unmodified linesExpand all1931941951961971971981992002011 unmodified line192 unmodified linesExpand all useTitle(isHidden ? m['screens.profileList.hide.hiddenToast']() : list.name);
return ( <> <Header list={list} preferences={preferences} /> <Header list={list} preferences={preferences} bottomBorder /> <AboutSection list={list} onPressAddUser={onPressAddUser} /> <ListAddRemoveUsersDialog handle={addUserDialogHandle} list={list} /> </> );1 unmodified line20 unmodified lines21222324252627282930313233122 unmodified linesExpand all15615715815915816016116216316416516616720 unmodified linesimport { MoreOptionsMenu } from './MoreOptionsMenu';import { SubscribeMenu } from './SubscribeMenu';
export function Header({ bottomBorder, list, preferences,}: { bottomBorder?: boolean; list: AppBskyGraphDefs.ListView; preferences: UsePreferencesQueryResponse;}) { const router = useRouter();122 unmodified linesExpand all ) : null} <MoreOptionsMenu list={list} /> </Layout.Header.Slot> </Layout.Header.Outer> <ListHeader list={list} isOwner={list.creator.did === currentAccount?.did} /> <ListHeader list={list} isOwner={list.creator.did === currentAccount?.did} bottomBorder={bottomBorder} /> </> );}12345656789101178910111213141516171819202122232425262728293031323321 unmodified linesimport { style } from '@vanilla-extract/css';
import { vars } from '#/styles/contract.css';import { recipe } from '#/styles/recipe';import { space } from '#/styles/tokens.css';
export const outer = style({ display: 'flex', flexDirection: 'column', gap: space.lg, paddingBottom: space.sm, paddingInline: space.lg,});export const outer = recipe( { base: { display: 'flex', flexDirection: 'column', gap: space.lg, paddingInline: space.lg, }, defaultVariants: { bottomBorder: false }, variants: { bottomBorder: { false: { paddingBottom: space.sm, }, true: { paddingBottom: space.lg, borderBottom: `1px solid ${vars.palette.contrast_100}`, }, }, }, }, { debugId: 'outer' },);
export const header = style({ display: 'flex', flexDirection: 'row',21 unmodified lines13 unmodified lines1415161718192021221819202122232425262728293021 unmodified lines5253545552565758596029 unmodified lines13 unmodified linesimport { m } from '#/paraglide/messages';
import * as css from './ListHeader.css';
/** * profile-subpage header card for a list: avatar, title, and a "by …" byline, followed by the list * description. */export function ListHeader({ isOwner, list }: { isOwner: boolean; list: AppBskyGraphDefs.ListView }) {export function ListHeader({ bottomBorder, isOwner, list,}: { bottomBorder?: boolean; isOwner: boolean; list: AppBskyGraphDefs.ListView;}) { const onPressAvi = () => { if ( list.avatar // TODO && !(view.moderation.avatar.blur && view.moderation.avatar.noOverride) ) {21 unmodified lines } : undefined;
return ( <div className={css.outer}> <div className={css.outer({ bottomBorder })}> <div className={css.header}> <button type="button" className={css.avatarButton}29 unmodified lines