diff --git a/src/components/Button.tsx b/src/components/Button.tsx index 7cc013d..a927df7 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -27,7 +27,7 @@ function Button({ onClick?.(e); }} className={clsx( - "transition-all flex outline-none 2xl:gap-[0.556vw] gap-2 items-center justify-center font-medium disabled:bg-[#F6F6F6] disabled:text-[#D6D6D6] cursor-pointerdisabled:cursor-default", + "transition-all flex outline-none 2xl:gap-[0.556vw] gap-2 items-center justify-center font-medium disabled:bg-[#F6F6F6] disabled:text-[#D6D6D6]", variant === "critical" && "text-[#FF4517] bg-[#FEF3F2] hover:bg-[#FEE4E2]", variant === "secondary" && diff --git a/src/components/ProjectSelector.tsx b/src/components/ProjectSelector.tsx index 3649599..ecb0f2e 100644 --- a/src/components/ProjectSelector.tsx +++ b/src/components/ProjectSelector.tsx @@ -20,6 +20,10 @@ function ProjectSelector({ setSelectedProject, activeProject, }: Props) { + useEffect(() => { + console.log(projects); + }, [projects]); + const [isOpen, setIsOpen] = useState(false); const [pointedProject, setPointedProject] = useState(null); diff --git a/src/components/SearchInput.tsx b/src/components/SearchInput.tsx index 0d96133..1284916 100644 --- a/src/components/SearchInput.tsx +++ b/src/components/SearchInput.tsx @@ -1,15 +1,14 @@ import React, { useRef } from "react"; import SearchIcon from "./icons/SearchIcon"; import CloseIcon from "./icons/CloseIcon"; -import Button from "./Button"; import clsx from "clsx"; function SearchInput( props: React.InputHTMLAttributes & { - onEnter?: () => void; setSearch: React.Dispatch>; } ) { + // const [value, setValue] = useState(); const ref = useRef(null); return ( @@ -26,9 +25,6 @@ function SearchInput( className="outline-none focus:outline-none placeholder:button-m placeholder:font-medium placeholder:text-[#7D7D7D] button-m font-medium flex-1" {...props} ref={ref} - onKeyDown={(e) => { - if (e.key === "Enter") props.onEnter?.(); - }} />
{ - // if (ref.current) { - // ref.current.value = ""; - // ref.current.focus(); - // } - // }} + onClick={() => { + if (ref.current) { + ref.current.value = ""; + ref.current.focus(); + props.setSearch(ref.current.value); + } + }} > -
{ - if (ref.current) { - ref.current.value = ""; - ref.current.focus(); - props.setSearch(ref.current.value); - } - }} - > +
- {/* {pr ops.onEnter && ( - - )} */}
); diff --git a/src/components/modals/CreateSessionModal.tsx b/src/components/modals/CreateSessionModal.tsx index d867127..dfeba24 100644 --- a/src/components/modals/CreateSessionModal.tsx +++ b/src/components/modals/CreateSessionModal.tsx @@ -42,7 +42,9 @@ export default function CreateSessionModal({ targetServerId }: Props) { useEffect(() => { setSelectedApp( - selectedServer?.sessions?.[0]?.app || selectedServer?.apps?.[0] || null + selectedServer?.sessions?.[0]?.app || + selectedServer?.apps?.[0].app || + null ); }, [selectedServer]); @@ -204,7 +206,7 @@ export default function CreateSessionModal({ targetServerId }: Props) { ? selectedApp : null } - projects={selectedServer?.apps} + projects={selectedServer?.apps.map(({ app }) => app)} selectedProject={selectedApp} setSelectedProject={setSelectedApp} /> diff --git a/src/pages/SessionsPage.tsx b/src/pages/SessionsPage.tsx index 44ef9ec..4d03af5 100644 --- a/src/pages/SessionsPage.tsx +++ b/src/pages/SessionsPage.tsx @@ -13,6 +13,7 @@ import MultySelect from "../components/MultySelect"; import Button from "../components/Button"; import SearchInput from "../components/SearchInput"; import CloseIcon from "../components/icons/CloseIcon"; +import SpinIcon from "../components/icons/SpinIcon"; function SessionsPage() { const [limit, setLimit] = useState(10); @@ -39,7 +40,7 @@ function SessionsPage() { enabled: !!me, }); - const { data: grouppedSessions } = useQuery({ + const { data: grouppedSessions, isLoading } = useQuery({ queryKey: ["sessions", managerIds, appIds, debouncedSearch, limit], queryFn: () => api @@ -86,7 +87,6 @@ function SessionsPage() { placeholder="Поиск по имени клиента" value={search || ""} onChange={(e) => setSearch(e.target.value)} - onEnter={() => {}} setSearch={setSearch} />
@@ -127,7 +127,11 @@ function SessionsPage() {
- {grouppedSessions?.length ? ( + {isLoading ? ( +
+ +
+ ) : grouppedSessions?.length ? ( grouppedSessions?.map(([timestamp, sessions]) => (

@@ -159,9 +163,7 @@ function SessionsPage() { size="large" variant="primary" className="w-full" - onClick={() => { - setLimit((prev) => prev + 10); - }} + onClick={() => setLimit((prev) => prev + 10)} disabled={!!count && limit >= count} > Показать еще diff --git a/src/types/Server.ts b/src/types/Server.ts index dad4c51..5bdf97f 100644 --- a/src/types/Server.ts +++ b/src/types/Server.ts @@ -8,7 +8,7 @@ export interface Server { description: string; companyId: string; sessions?: Session[]; - apps?: App[]; + apps?: { app: App }[]; status: "online" | "offline"; ipAddress: string; }