feat: custom member selector dialog header

apps/nestjs-backend/src/features/auth/auth.controller.ts

@@ -1,7 +1,9 @@
 import { Controller, Get, HttpCode, Post, Req, Res } from '@nestjs/common';
 import type { IUserMeVo } from '@teable/openapi';
 import { Response } from 'express';
+import { ClsService } from 'nestjs-cls';
 import { AUTH_SESSION_COOKIE_NAME } from '../../const';
+import type { IClsStore } from '../../types/cls';
 import { AuthService } from './auth.service';
 import { TokenAccess } from './decorators/token.decorator';
 import { SessionService } from './session/session.service';
@@ -10,7 +12,8 @@ import { SessionService } from './session/session.service';
 export class AuthController {
   constructor(
     private readonly authService: AuthService,
-    private readonly sessionService: SessionService
+    private readonly sessionService: SessionService,
+    private readonly cls: ClsService<IClsStore>
   ) {}
 
   @Post('signout')
@@ -22,7 +25,10 @@ export class AuthController {
 
   @Get('/user/me')
   async me(@Req() request: Express.Request) {
-    return request.user;
+    return {
+      ...request.user,
+      organization: this.cls.get('organization'),
+    };
   }
 
   @Get('/user')

apps/nestjs-backend/test/base-query.e2e-spec.ts

@@ -274,7 +274,6 @@ describe('BaseSqlQuery e2e', () => {
         from: table.id,
         groupBy: [{ column: table.fields[0].id, type: BaseQueryColumnType.Field }],
       });
-      console.log('res.data', res.data);
       expect(res.data.columns).toHaveLength(1);
       expect(res.data.rows).toEqual([
         {},

apps/nextjs-app/src/features/app/components/collaborator-manage/components/Collaborator.tsx

@@ -30,7 +30,11 @@ export const Collaborator = (props: ICollaboratorProps) => {
       {item.type === PrincipalType.User && (
         <UserAvatar user={{ name: item.name, avatar: item.avatar }} />
       )}
-      {item.type === PrincipalType.Department && <Building2 className="size-6" />}
+      {item.type === PrincipalType.Department && (
+        <div className=" flex size-7 items-center justify-center rounded-full bg-accent">
+          <Building2 className="size-4" />
+        </div>
+      )}
       <div className="ml-2 flex flex-1 flex-col space-y-1">
         <p className="text-sm font-medium leading-none">
           {item.name}

packages/sdk/src/components/member-selector/MemberContent.tsx

@@ -1,4 +1,5 @@
 import { Button, cn, DialogFooter, DialogHeader, DialogTitle, Separator } from '@teable/ui-lib';
+import type { ReactNode } from 'react';
 import { forwardRef, useEffect, useImperativeHandle, useState } from 'react';
 import { useTranslation } from '../../context/app/i18n';
 import { DepartmentList } from './DepartmentList';
@@ -11,6 +12,7 @@ interface IMemberContentProps {
   departmentId?: string;
   defaultSelectedMembers?: SelectedMemberWithData[];
   disabledDepartment?: boolean;
+  header?: ReactNode;
   onLoadData?: () => SelectedMemberWithData[];
   onCancel?: () => void;
   onConfirm?: (selectedMembers: SelectedMemberWithData[]) => void;
@@ -25,6 +27,7 @@ const _defaultSelectedMembers: SelectedMemberWithData[] = [];
 export const MemberContent = forwardRef<IMemberContentRef, IMemberContentProps>(
   (
     {
+      header,
       className,
       departmentId,
       defaultSelectedMembers,
@@ -74,7 +77,7 @@ export const MemberContent = forwardRef<IMemberContentRef, IMemberContentProps>(
     return (
       <div className={cn('flex flex-col gap-4', className)}>
         <DialogHeader>
-          <DialogTitle>{t('memberSelector.title')}</DialogTitle>
+          <DialogTitle>{header ?? t('memberSelector.title')}</DialogTitle>
         </DialogHeader>
         <div className="mb-2">
           <SearchInput

packages/sdk/src/components/member-selector/MemberSelectorDialog.tsx

@@ -9,6 +9,7 @@ interface IMemberSelectorDialogProps {
   departmentId?: string;
   children?: React.ReactNode;
   disabledDepartment?: boolean;
+  header?: React.ReactNode;
   onLoadData?: () => SelectedMemberWithData[];
   onConfirm?: (members: SelectedMemberWithData[]) => void;
   onCancel?: () => void;
@@ -25,12 +26,13 @@ export const MemberSelectorDialog = React.forwardRef<
 >(
   (
     {
-      departmentId,
+      header,
       children,
+      departmentId,
+      disabledDepartment,
       defaultSelectedMembers,
       onConfirm,
       onCancel,
-      disabledDepartment,
       onLoadData,
     }: IMemberSelectorDialogProps,
     ref
@@ -66,15 +68,16 @@ export const MemberSelectorDialog = React.forwardRef<
         <DialogContent className="w-[80vw] min-w-[600px]  max-w-6xl">
           <MemberContent
             ref={contentRef}
+            header={header}
             className="h-[80vh]"
             departmentId={departmentId}
+            disabledDepartment={disabledDepartment}
             defaultSelectedMembers={defaultSelectedMembers}
             onCancel={() => {
               handleChange(false);
             }}
             onLoadData={onLoadData}
             onConfirm={handleConfirm}
-            disabledDepartment={disabledDepartment}
           />
         </DialogContent>
       </Dialog>

packages/sdk/src/components/member-selector/index.ts

@@ -1,7 +1,10 @@
 export * from './MemberSelectorDialog';
 export * from './MemberContent';
 export * from './DepartmentSelector';
-export {
-  type SelectedMemberWithData as ISelectedMember,
-  TreeNodeType as MemberSelectorNodeType,
+export { TreeNodeType as MemberSelectorNodeType } from './types';
+
+export type {
+  SelectedMemberWithData as ISelectedMember,
+  SelectedUserWithData as ISelectedUser,
+  SelectedDepartmentWithData as ISelectedDepartment,
 } from './types';

packages/sdk/src/components/member-selector/types.ts

@@ -27,11 +27,11 @@ export type SelectedDepartment = {
 
 export type SelectedMember = SelectedUser | SelectedDepartment;
 
-type SelectedUserWithData = SelectedUser & {
+export interface SelectedUserWithData extends SelectedUser {
   data: UserNode;
-};
+}
 
-type SelectedDepartmentWithData = SelectedDepartment & {
+export type SelectedDepartmentWithData = SelectedDepartment & {
   data: DepartmentNode;
 };