mirror of
https://github.com/docmost/docmost.git
synced 2026-08-25 15:57:11 +08:00
feat: pin the current user at the top of the creator filter
This commit is contained in:
@@ -1309,5 +1309,6 @@
|
|||||||
"Read-only mode": "Read-only mode",
|
"Read-only mode": "Read-only mode",
|
||||||
"AI Chat can search and read workspace content, but cannot create or edit pages.": "AI Chat can search and read workspace content, but cannot create or edit pages.",
|
"AI Chat can search and read workspace content, but cannot create or edit pages.": "AI Chat can search and read workspace content, but cannot create or edit pages.",
|
||||||
"Toggle AI Chat read-only mode": "Toggle AI Chat read-only mode",
|
"Toggle AI Chat read-only mode": "Toggle AI Chat read-only mode",
|
||||||
"Title only": "Title only"
|
"Title only": "Title only",
|
||||||
|
"you": "you"
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { ReactNode, useState } from "react";
|
import { ReactNode, useMemo, useState } from "react";
|
||||||
import { Divider, Group, Menu, ScrollArea, Text, TextInput } from "@mantine/core";
|
import { Divider, Group, Menu, ScrollArea, Text, TextInput } from "@mantine/core";
|
||||||
import { useDebouncedValue } from "@mantine/hooks";
|
import { useDebouncedValue } from "@mantine/hooks";
|
||||||
import { IconCheck, IconSearch } from "@tabler/icons-react";
|
import { IconCheck, IconSearch } from "@tabler/icons-react";
|
||||||
@@ -7,6 +7,8 @@ import { useSearchSuggestionsQuery } from "@/features/search/queries/search-quer
|
|||||||
import { RadioMenuItem } from "@/components/ui/radio-menu-item";
|
import { RadioMenuItem } from "@/components/ui/radio-menu-item";
|
||||||
import { CustomAvatar } from "@/components/ui/custom-avatar.tsx";
|
import { CustomAvatar } from "@/components/ui/custom-avatar.tsx";
|
||||||
import { IUser } from "@/features/user/types/user.types.ts";
|
import { IUser } from "@/features/user/types/user.types.ts";
|
||||||
|
import { useAtomValue } from "jotai";
|
||||||
|
import { userAtom } from "@/features/user/atoms/current-user-atom.ts";
|
||||||
|
|
||||||
type CreatorFilterMenuProps = {
|
type CreatorFilterMenuProps = {
|
||||||
value: string | null;
|
value: string | null;
|
||||||
@@ -48,6 +50,19 @@ export function CreatorFilterMenu({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const users: IUser[] = (suggestion?.users as IUser[]) ?? [];
|
const users: IUser[] = (suggestion?.users as IUser[]) ?? [];
|
||||||
|
const currentUser = useAtomValue(userAtom);
|
||||||
|
|
||||||
|
// pin the signed-in user on top so they never have to search themselves
|
||||||
|
const displayUsers = useMemo(() => {
|
||||||
|
if (!currentUser) return users;
|
||||||
|
const others = users.filter((user) => user.id !== currentUser.id);
|
||||||
|
const q = debouncedQuery.trim().toLowerCase();
|
||||||
|
const matchesQuery =
|
||||||
|
!q ||
|
||||||
|
currentUser.name?.toLowerCase().includes(q) ||
|
||||||
|
currentUser.email?.toLowerCase().includes(q);
|
||||||
|
return matchesQuery ? [currentUser as IUser, ...others] : users;
|
||||||
|
}, [users, currentUser, debouncedQuery]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Menu
|
<Menu
|
||||||
@@ -91,13 +106,13 @@ export function CreatorFilterMenu({
|
|||||||
|
|
||||||
<Divider my="xs" />
|
<Divider my="xs" />
|
||||||
|
|
||||||
{users.length === 0 && (
|
{displayUsers.length === 0 && (
|
||||||
<Text size="xs" c="dimmed" px="xs" py="sm">
|
<Text size="xs" c="dimmed" px="xs" py="sm">
|
||||||
{isLoading ? t("Loading...") : t("No users found")}
|
{isLoading ? t("Loading...") : t("No users found")}
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{users.map((user) => (
|
{displayUsers.map((user) => (
|
||||||
<Menu.Item
|
<Menu.Item
|
||||||
key={user.id}
|
key={user.id}
|
||||||
component={RadioMenuItem}
|
component={RadioMenuItem}
|
||||||
@@ -112,7 +127,9 @@ export function CreatorFilterMenu({
|
|||||||
/>
|
/>
|
||||||
<div style={{ flex: 1, minWidth: 0 }}>
|
<div style={{ flex: 1, minWidth: 0 }}>
|
||||||
<Text size="sm" fw={500} truncate>
|
<Text size="sm" fw={500} truncate>
|
||||||
{user.name}
|
{user.id === currentUser?.id
|
||||||
|
? `${user.name} (${t("you")})`
|
||||||
|
: user.name}
|
||||||
</Text>
|
</Text>
|
||||||
{user.email && (
|
{user.email && (
|
||||||
<Text size="xs" c="dimmed" truncate>
|
<Text size="xs" c="dimmed" truncate>
|
||||||
|
|||||||
Reference in New Issue
Block a user