client: update filterUserOrganizations

This commit is contained in:
fantasticit 2022-06-30 22:05:42 +08:00
parent f1a788fce1
commit 5f49205306
1 changed files with 35 additions and 31 deletions

View File

@ -5,6 +5,7 @@ import { DataRender } from 'components/data-render';
import { useOrganizationDetail, useUserOrganizations } from 'data/organization'; import { useOrganizationDetail, useUserOrganizations } from 'data/organization';
import { useRouterQuery } from 'hooks/use-router-query'; import { useRouterQuery } from 'hooks/use-router-query';
import Link from 'next/link'; import Link from 'next/link';
import { useMemo } from 'react';
import styles from './index.module.scss'; import styles from './index.module.scss';
@ -17,6 +18,11 @@ export const UserOrganizationsSwitcher = () => {
loading: userOrganizationsLoading, loading: userOrganizationsLoading,
error: userOrganizationsError, error: userOrganizationsError,
} = useUserOrganizations(); } = useUserOrganizations();
const filterUserOrganizations = useMemo(() => {
return userOrganizations && userOrganizations.length
? userOrganizations.filter((org) => org.id !== organizationId)
: [];
}, [userOrganizations, organizationId]);
return ( return (
<Dropdown <Dropdown
@ -28,38 +34,36 @@ export const UserOrganizationsSwitcher = () => {
normalContent={() => { normalContent={() => {
return ( return (
<Dropdown.Menu> <Dropdown.Menu>
{userOrganizations.length ? ( {filterUserOrganizations.length ? (
<> <>
{userOrganizations {filterUserOrganizations.map((org) => {
.filter((org) => org.id !== organizationId) return (
.map((org) => { <Dropdown.Item key={org.id} style={{ padding: 0 }}>
return ( <Link
<Dropdown.Item key={org.id} style={{ padding: 0 }}> href={{
<Link pathname: '/app/org/[organizationId]',
href={{ query: {
pathname: '/app/org/[organizationId]', organizationId: org.id,
query: { },
organizationId: org.id, }}
}, >
}} <a style={{ display: 'flex', alignItems: 'center', width: '100%', padding: '8px 16px' }}>
> <Avatar size="extra-small" src={org.logo} style={{ marginRight: 8 }} />
<a style={{ display: 'flex', alignItems: 'center', width: '100%', padding: '8px 16px' }}> <Paragraph
<Avatar size="extra-small" src={org.logo} style={{ marginRight: 8 }} /> style={{
<Paragraph maxWidth: 100,
style={{ whiteSpace: 'nowrap',
maxWidth: 100, textOverflow: 'ellipsis',
whiteSpace: 'nowrap', overflow: 'hidden',
textOverflow: 'ellipsis', }}
overflow: 'hidden', >
}} {org.name}
> </Paragraph>
{org.name} </a>
</Paragraph> </Link>
</a> </Dropdown.Item>
</Link> );
</Dropdown.Item> })}
);
})}
<Dropdown.Divider /> <Dropdown.Divider />
</> </>
) : null} ) : null}