diff --git a/src/app/(rucio)/dashboard/page.tsx b/src/app/(rucio)/dashboard/page.tsx index 1d7f64f60..c59214505 100644 --- a/src/app/(rucio)/dashboard/page.tsx +++ b/src/app/(rucio)/dashboard/page.tsx @@ -1,12 +1,27 @@ -'use client'; -import { fixtureOngoingrules, fixtureUsedquota } from "test/fixtures/widget-fixtures"; -import { Dashboard as DashboardStory } from "@/component-library/Pages/Dashboard/Dashboard"; -import { Role } from "@/lib/core/entity/account"; +'use client' +import { + fixtureOngoingrules, + fixtureUsedquota, +} from 'test/fixtures/widget-fixtures' +import { Dashboard as DashboardStory } from '@/component-library/Pages/Dashboard/Dashboard' +import { Role } from '@/lib/core/entity/account' +import { SiteHeaderViewModel } from '@/lib/infrastructure/data/view-model/site-header' +import { useEffect, useState } from 'react' +import { getSiteHeader } from '../queries' +import { Loading } from '@/component-library/Pages/Helpers/Loading' +import { User } from '@/lib/core/entity/auth-models' export default function Page() { + const [siteHeader, setSiteHeader] = useState( + {status: "pending"} as SiteHeaderViewModel, + ) + useEffect(() => { + getSiteHeader().then((vm: SiteHeaderViewModel) => setSiteHeader(vm)) + }, []) + if (siteHeader.status === "pending") return return ( fixtureOngoingrules())} inputUsedquota={Array.from({ length: 20 }, (v, k) => fixtureUsedquota())} /> diff --git a/src/app/(rucio)/queries.ts b/src/app/(rucio)/queries.ts new file mode 100644 index 000000000..fda88bc27 --- /dev/null +++ b/src/app/(rucio)/queries.ts @@ -0,0 +1,25 @@ +import { SiteHeaderViewModel } from '@/lib/infrastructure/data/view-model/site-header' +import { HTTPRequest, prepareRequestArgs } from '@/lib/sdk/http' + +export async function getSiteHeader(): Promise { + const req: HTTPRequest = { + method: 'GET', + url: new URL( + `${process.env.NEXT_PUBLIC_WEBUI_HOST}/api/feature/get-site-header`, + ), + headers: { + 'Content-Type': 'application/json', + }, + params: {}, + } + + const { url, requestArgs } = prepareRequestArgs(req) + const res = await fetch(url, { + method: 'GET', + headers: new Headers({ + 'Content-Type': 'application/json', + } as HeadersInit), + }) + + return await res.json() +} diff --git a/src/app/(rucio)/rule/page/[id]/page.tsx b/src/app/(rucio)/rule/page/[id]/page.tsx index e292192a8..5e3168acd 100644 --- a/src/app/(rucio)/rule/page/[id]/page.tsx +++ b/src/app/(rucio)/rule/page/[id]/page.tsx @@ -5,6 +5,8 @@ import { useState, useEffect } from "react"; import useComDOM from "@/lib/infrastructure/hooks/useComDOM"; import { HTTPRequest } from "@/lib/sdk/http"; import { RuleMetaViewModel, RulePageLockEntryViewModel } from "@/lib/infrastructure/data/view-model/rule"; +import { getSiteHeader } from "@/app/(rucio)/queries"; +import { SiteHeaderViewModel } from "@/lib/infrastructure/data/view-model/site-header"; export default function PageRule({ params }: { params: { id: string } }) { const comDOM = useComDOM( @@ -15,9 +17,15 @@ export default function PageRule({ params }: { params: { id: string } }) { 50, true ) + const [isAdmin, setIsAdmin] = useState(false) + useEffect(() => { + getSiteHeader().then((vm: SiteHeaderViewModel) => + setIsAdmin(vm.activeAccount?.role === 'admin'), + ) + }, []) const [meta, setMeta] = useState({} as RuleMetaViewModel) useEffect(() => { - setMeta({...fixtureRuleMetaViewModel(), id: params.id}) + setMeta({ ...fixtureRuleMetaViewModel(), id: params.id }) }, []) useEffect(() => { const runQuery = async () => { @@ -37,6 +45,10 @@ export default function PageRule({ params }: { params: { id: string } }) { { + console.log('boost not implemented') + }} + ruleBoostShow={isAdmin} /> ) } diff --git a/src/component-library/Pages/Rule/PageRule.stories.tsx b/src/component-library/Pages/Rule/PageRule.stories.tsx index bfda84ce2..933721456 100644 --- a/src/component-library/Pages/Rule/PageRule.stories.tsx +++ b/src/component-library/Pages/Rule/PageRule.stories.tsx @@ -14,4 +14,6 @@ export const PageRule = Template.bind({}); PageRule.args = { ruleMeta: fixtureRuleMetaViewModel(), ruleLocks: mockUseComDOM(Array.from({length: 100}, () => fixtureRulePageLockEntryViewModel())), + ruleBoostFunc: () => {console.log("boosted rule")}, + ruleBoostShow: true, }; diff --git a/src/component-library/Pages/Rule/PageRule.tsx b/src/component-library/Pages/Rule/PageRule.tsx index c6d5d1f60..6e12d9c11 100644 --- a/src/component-library/Pages/Rule/PageRule.tsx +++ b/src/component-library/Pages/Rule/PageRule.tsx @@ -24,11 +24,15 @@ import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM"; import { Heading } from "../Helpers/Heading"; import { Body } from "../Helpers/Body"; import { RuleMetaViewModel, RulePageLockEntryViewModel } from "@/lib/infrastructure/data/view-model/rule"; +import { Button } from "@/component-library/Button/Button"; +import { HiRocketLaunch } from "react-icons/hi2"; export interface PageRulePageProps { ruleMeta: RuleMetaViewModel; ruleLocks: UseComDOM + ruleBoostFunc: () => void; + ruleBoostShow: boolean; } @@ -152,7 +156,22 @@ export const PageRule = ( + > +
+
+
} @@ -70,8 +71,8 @@ export const ListSubscription = ( column={info.column} element={ } @@ -93,8 +94,8 @@ export const ListSubscription = ( column={info.column} element={ } @@ -116,8 +117,8 @@ export const ListSubscription = ( column={info.column} element={ } @@ -130,6 +131,52 @@ export const ListSubscription = ( style: "w-12 lg:w-32", } }), + columnHelper.accessor("state_waiting_approval", { + id: "state_waiting_approval", + header: info => { + return ( + + } + stack + /> + ) + }, + cell: info =>

{info.getValue()}

, + meta: { + style: "w-12 lg:w-32", + } + }), + columnHelper.accessor("state_inject", { + id: "state_inject", + header: info => { + return ( + + } + stack + /> + ) + }, + cell: info =>

{info.getValue()}

, + meta: { + style: "w-12 lg:w-32", + } + }), columnHelper.display({ id: "condensed_states", header: info =>

States

, @@ -155,6 +202,8 @@ export const ListSubscription = ( + + ) }, @@ -165,25 +214,7 @@ export const ListSubscription = ( ] - const [windowSize, setWindowSize] = useState([ - 1920, 1080 - ]); - - useEffect(() => { - setWindowSize([window.innerWidth, window.innerHeight]) - - const handleWindowResize = () => { - setWindowSize([window.innerWidth, window.innerHeight]); - }; - - window.addEventListener('resize', handleWindowResize); - - return () => { - window.removeEventListener('resize', handleWindowResize); - }; - }, []); - const isSm = () => windowSize[0] > 640 // 640px is the breakpoint for sm => is minimum sm sized - const isLg = () => windowSize[0] > 1024 // 1024px is the breakpoint for lg => is minimum lg sized + const responsive = useReponsiveHook() return ( @@ -202,11 +233,13 @@ export const ListSubscription = ( tablecolumns={tablecolumns} tablestyling={{ visibility: { - "state_ok": isSm(), - "state_replicating": isSm(), - "state_stuck": isSm(), - "state_suspended": isSm(), - "condensed_states": !isSm(), + "state_ok": responsive.sm, + "state_replicating": responsive.sm, + "state_stuck": responsive.sm, + "state_suspended": responsive.sm, + "state_waiting_approval": responsive.sm, + "state_inject": responsive.sm, + "condensed_states": !responsive.sm, }, tableHeadRowStyle: "md:h-16", tableBodyRowStyle: "h-8", diff --git a/test/component/PageRule.test.tsx b/test/component/PageRule.test.tsx index 131b8d3aa..031b34241 100644 --- a/test/component/PageRule.test.tsx +++ b/test/component/PageRule.test.tsx @@ -16,6 +16,8 @@ describe("PageRule Story Test", () => { fixtureRulePageLockEntryViewModel()))} + ruleBoostFunc={() => {}} + ruleBoostShow={false} /> )) const user = userEvent.setup() @@ -35,12 +37,9 @@ describe("PageRule Story Test", () => { ).toHaveTextContent( `${ruleMeta.scope}:${ruleMeta.name}` ) - // click on header - await user.click(screen.getByRole("heading", { name: /For rule/})) - selectedTabExpect().not.toHaveFocus() - // tab to focus the `locks` tab - await user.tab() - selectedTabExpect().toHaveFocus() + + + await user.click(screen.getByRole("tab", { name: "Locks"})) // arrow right to focus the `metadata` tab (test cycling!) await user.keyboard("{arrowright}") selectedTabExpect().toHaveTextContent("Metadata") diff --git a/test/fixtures/table-fixtures.ts b/test/fixtures/table-fixtures.ts index b6facb70a..07489876b 100644 --- a/test/fixtures/table-fixtures.ts +++ b/test/fixtures/table-fixtures.ts @@ -325,8 +325,10 @@ export function fixtureSubscriptionRuleStatesViewModel(): SubscriptionRuleStates state_replicating: faker.number.int({ min: 0, max: 10 }), state_stuck: faker.number.int({ min: 0, max: 10 }), state_suspended: faker.number.int({ min: 0, max: 10 }), - state_inject: faker.number.int({ min: 0, max: 10 }), state_waiting_approval: faker.number.int({ min: 0, max: 10 }), + state_inject: faker.number.int({ min: 0, max: 10 }), + + } }