From fa62847b8c02896c843ae87a83a0d453cce3985e Mon Sep 17 00:00:00 2001 From: Vladyslav Palyvoda Date: Fri, 15 Nov 2024 14:37:48 +0200 Subject: [PATCH] fix: Bugs after latest update (#485) --- .../components/Actions/index.tsx | 16 +++++++----- .../components/Actions/types.ts | 7 ----- .../components/Summary/index.tsx | 26 ++++++------------- .../components/Summary/types.ts | 7 ----- .../components/CodebaseBranch/index.tsx | 16 +++++------- .../components/CodebaseBranch/types.ts | 7 ----- .../components/CodebaseBranchesList/index.tsx | 3 --- .../providers/DynamicData/context.ts | 3 ++- .../providers/DynamicData/provider.tsx | 15 ++++++++++- .../providers/DynamicData/types.ts | 2 ++ .../TaskRunStepWrapper/hooks/useTabs.tsx | 10 +++++-- src/pages/pipeline-details/page.tsx | 2 +- src/pages/stage-details/view.tsx | 3 +-- src/providers/Tabs/hooks.ts | 3 +-- src/services/link-creation/git/index.ts | 4 +++ .../CustomActionsInlineList/index.tsx | 22 ++++++++-------- src/widgets/PodsLogViewer/types.ts | 2 +- 17 files changed, 69 insertions(+), 79 deletions(-) diff --git a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Actions/index.tsx b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Actions/index.tsx index 58a21c47..ea8f12e4 100644 --- a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Actions/index.tsx +++ b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Actions/index.tsx @@ -4,19 +4,23 @@ import React from 'react'; import { ICONS } from '../../../../../../../../icons/iconify-icons-mapping'; import { CodebaseBranchActionsMenu } from '../../../../../../../../widgets/CodebaseBranchActionsMenu'; import { useTypedPermissions } from '../../../../../../hooks/useTypedPermissions'; +import { useDynamicDataContext } from '../../../../../../providers/DynamicData/hooks'; import { ActionsProps } from './types'; -export const Actions = ({ - codebaseBranchData, - codebaseData, - pipelines, - defaultBranch, -}: ActionsProps) => { +export const Actions = ({ codebaseBranchData }: ActionsProps) => { const buttonRef = React.createRef(); const [anchor, setAnchor] = React.useState(null); const permissions = useTypedPermissions(); + const { + codebaseBranches: { data: codebaseBranches }, + component: { data: codebaseData }, + pipelines: { data: pipelines }, + } = useDynamicDataContext(); + + const defaultBranch = codebaseBranches?.[0]; + return ( <> { +export const Summary = ({ codebaseBranchData, pipelineRuns }: SummaryProps) => { + const { + component: { data: codebaseData }, + gitServerByCodebase: { data: gitServerByCodebase }, + } = useDynamicDataContext(); + const permissions = useTypedPermissions(); const { createBuildPipelineRun } = useCreateBuildPipelineRun({}); - const { data: gitServerByCodebase } = useGitServerByCodebaseQuery({ - props: { codebaseGitServer: codebaseData?.spec.gitServer }, - }); - const { data: buildTriggerTemplate } = useTriggerTemplateByNameQuery({ props: { name: `${gitServerByCodebase?.spec?.gitProvider}-build-template`, @@ -234,12 +229,7 @@ export const Summary = ({ e.stopPropagation(); }} > - + diff --git a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Summary/types.ts b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Summary/types.ts index 7f58efd1..58c922d7 100644 --- a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Summary/types.ts +++ b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/components/Summary/types.ts @@ -1,17 +1,10 @@ -import { CodebaseKubeObjectInterface } from '../../../../../../../../k8s/groups/EDP/Codebase/types'; import { CodebaseBranchKubeObjectInterface } from '../../../../../../../../k8s/groups/EDP/CodebaseBranch/types'; import { PipelineRunKubeObjectInterface } from '../../../../../../../../k8s/groups/Tekton/PipelineRun/types'; export interface SummaryProps { codebaseBranchData: CodebaseBranchKubeObjectInterface; - codebaseData: CodebaseKubeObjectInterface; pipelineRuns: { all: PipelineRunKubeObjectInterface[]; latestBuildPipelineRun: PipelineRunKubeObjectInterface; }; - defaultBranch: CodebaseBranchKubeObjectInterface; - pipelines: { - review: string; - build: string; - }; } diff --git a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/index.tsx b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/index.tsx index 9da507d9..4a2b2155 100644 --- a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/index.tsx +++ b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/index.tsx @@ -7,6 +7,7 @@ import { PIPELINE_RUN_LABEL_SELECTOR_CODEBASE_BRANCH } from '../../../../../../k import { PipelineRunKubeObjectInterface } from '../../../../../../k8s/groups/Tekton/PipelineRun/types'; import { sortKubeObjectByCreationTimestamp } from '../../../../../../utils/sort/sortKubeObjectsByCreationTimestamp'; import { rem } from '../../../../../../utils/styling/rem'; +import { useDynamicDataContext } from '../../../../providers/DynamicData/hooks'; import { Details } from './components/Details'; import { Summary } from './components/Summary'; import { CodebaseBranchProps } from './types'; @@ -16,10 +17,11 @@ export const CodebaseBranch = ({ expandedPanel, id, handlePanelChange, - codebaseData, - defaultBranch, - pipelines, }: CodebaseBranchProps) => { + const { + component: { data: codebaseData }, + } = useDynamicDataContext(); + const [pipelineRuns, setPipelineRuns] = React.useState<{ all: PipelineRunKubeObjectInterface[]; latestBuildPipelineRun: PipelineRunKubeObjectInterface; @@ -87,13 +89,7 @@ export const CodebaseBranch = ({ }, }} > - +
diff --git a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/types.ts b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/types.ts index f4d42a9a..25604545 100644 --- a/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/types.ts +++ b/src/pages/component-details/components/CodebaseBranchesList/components/CodebaseBranch/types.ts @@ -1,16 +1,9 @@ import React from 'react'; -import { CodebaseKubeObjectInterface } from '../../../../../../k8s/groups/EDP/Codebase/types'; import { CodebaseBranchKubeObjectInterface } from '../../../../../../k8s/groups/EDP/CodebaseBranch/types'; export interface CodebaseBranchProps { codebaseBranchData: CodebaseBranchKubeObjectInterface; expandedPanel: string; id: string; - codebaseData: CodebaseKubeObjectInterface; handlePanelChange: (panel: string) => (event: React.SyntheticEvent, isExpanded: boolean) => void; - defaultBranch: CodebaseBranchKubeObjectInterface; - pipelines: { - review: string; - build: string; - }; } diff --git a/src/pages/component-details/components/CodebaseBranchesList/index.tsx b/src/pages/component-details/components/CodebaseBranchesList/index.tsx index 53e48af2..241f2d01 100644 --- a/src/pages/component-details/components/CodebaseBranchesList/index.tsx +++ b/src/pages/component-details/components/CodebaseBranchesList/index.tsx @@ -53,10 +53,7 @@ export const CodebaseBranchesList = () => { id={branchId} codebaseBranchData={codebaseBranchData} expandedPanel={expandedPanel} - codebaseData={component} handlePanelChange={handleChange} - defaultBranch={codebaseBranches?.[0]} - pipelines={pipelines} /> ); })} diff --git a/src/pages/component-details/providers/DynamicData/context.ts b/src/pages/component-details/providers/DynamicData/context.ts index 3f700d71..d0e86c43 100644 --- a/src/pages/component-details/providers/DynamicData/context.ts +++ b/src/pages/component-details/providers/DynamicData/context.ts @@ -10,5 +10,6 @@ const initialData = { export const DynamicDataContext = React.createContext({ component: initialData, pipelines: initialData, - codebaseBranches: initialData + codebaseBranches: initialData, + gitServerByCodebase: initialData, }); diff --git a/src/pages/component-details/providers/DynamicData/provider.tsx b/src/pages/component-details/providers/DynamicData/provider.tsx index ea337791..4288b34c 100644 --- a/src/pages/component-details/providers/DynamicData/provider.tsx +++ b/src/pages/component-details/providers/DynamicData/provider.tsx @@ -1,3 +1,4 @@ +import { ApiError } from '@kinvolk/headlamp-plugin/lib/lib/k8s/apiProxy'; import React from 'react'; import { useParams } from 'react-router-dom'; import { CodebaseKubeObject } from '../../../../k8s/groups/EDP/Codebase'; @@ -17,7 +18,11 @@ export const DynamicDataContextProvider: React.FC = ({ children }) => { const [component, error] = CodebaseKubeObject.useGet(name, namespace); - const { data: gitServerByCodebase } = useGitServerByCodebaseQuery({ + const { + data: gitServerByCodebase, + isLoading: gitServerByCodebaseIsLoading, + error: gitServerByCodebaseError, + } = useGitServerByCodebaseQuery({ props: { codebaseGitServer: component?.spec.gitServer }, }); @@ -60,6 +65,11 @@ export const DynamicDataContextProvider: React.FC = ({ children }) => { error: codebaseBranchesError, isLoading: codebaseBranches === null, }, + gitServerByCodebase: { + data: gitServerByCodebase, + error: gitServerByCodebaseError as ApiError, + isLoading: gitServerByCodebaseIsLoading, + }, }), [ buildPipelineRefName, @@ -67,6 +77,9 @@ export const DynamicDataContextProvider: React.FC = ({ children }) => { codebaseBranchesError, component, error, + gitServerByCodebase, + gitServerByCodebaseError, + gitServerByCodebaseIsLoading, reviewPipelineRefName, sortedCodebaseBranches, ] diff --git a/src/pages/component-details/providers/DynamicData/types.ts b/src/pages/component-details/providers/DynamicData/types.ts index 305fdb47..5d3cbed6 100644 --- a/src/pages/component-details/providers/DynamicData/types.ts +++ b/src/pages/component-details/providers/DynamicData/types.ts @@ -1,5 +1,6 @@ import { CodebaseKubeObjectInterface } from '../../../../k8s/groups/EDP/Codebase/types'; import { CodebaseBranchKubeObjectInterface } from '../../../../k8s/groups/EDP/CodebaseBranch/types'; +import { GitServerKubeObjectInterface } from '../../../../k8s/groups/EDP/GitServer/types'; import { DataProviderValue } from '../../../../types/pages'; export interface DynamicDataContextProviderValue { @@ -9,4 +10,5 @@ export interface DynamicDataContextProviderValue { build: string; }>; codebaseBranches: DataProviderValue; + gitServerByCodebase: DataProviderValue; } diff --git a/src/pages/pipeline-details/components/Details/components/TaskRunStepWrapper/hooks/useTabs.tsx b/src/pages/pipeline-details/components/Details/components/TaskRunStepWrapper/hooks/useTabs.tsx index aa9052af..f479efb8 100644 --- a/src/pages/pipeline-details/components/Details/components/TaskRunStepWrapper/hooks/useTabs.tsx +++ b/src/pages/pipeline-details/components/Details/components/TaskRunStepWrapper/hooks/useTabs.tsx @@ -15,13 +15,19 @@ export const useTabs = ({ taskRun, task, stepName, pods }) => { [stepName] ); + const defaultContainer = getDefaultContainer(pods?.[0]); + return React.useMemo(() => { return [ { label: 'Logs', component: ( - + ), disabled: !pods?.length, @@ -35,5 +41,5 @@ export const useTabs = ({ taskRun, task, stepName, pods }) => { ), }, ]; - }, [details, getDefaultContainer, pods]); + }, [defaultContainer, details, getDefaultContainer, pods]); }; diff --git a/src/pages/pipeline-details/page.tsx b/src/pages/pipeline-details/page.tsx index cf04d312..f153bb4a 100644 --- a/src/pages/pipeline-details/page.tsx +++ b/src/pages/pipeline-details/page.tsx @@ -13,7 +13,7 @@ export default function () { const location = useLocation(); const queryParams = new URLSearchParams(location.search); const queryParamTaskRun = queryParams.get('taskRun'); - + return ( diff --git a/src/pages/stage-details/view.tsx b/src/pages/stage-details/view.tsx index 178c730d..c6074169 100644 --- a/src/pages/stage-details/view.tsx +++ b/src/pages/stage-details/view.tsx @@ -51,8 +51,7 @@ export const PageView = () => { const permissions = useTypedPermissions(); - - const { activeTab, handleChangeTab} = useTabsContext(); + const { activeTab, handleChangeTab } = useTabsContext(); return ( - React.useContext(TabsContext); +export const useTabsContext = () => React.useContext(TabsContext); diff --git a/src/services/link-creation/git/index.ts b/src/services/link-creation/git/index.ts index 72a6037a..91e09e62 100644 --- a/src/services/link-creation/git/index.ts +++ b/src/services/link-creation/git/index.ts @@ -31,6 +31,10 @@ export const GitURLService = { } }, createRepoBranchLink: (gitServer: GIT_PROVIDERS, baseUrl: string, branch: string) => { + if (!gitServer) { + return baseUrl; + } + const updatedUrl = new URL(baseUrl); switch (gitServer.toLowerCase()) { diff --git a/src/widgets/PipelineRunActionsMenu/components/CustomActionsInlineList/index.tsx b/src/widgets/PipelineRunActionsMenu/components/CustomActionsInlineList/index.tsx index 4bd53f4f..02b29233 100644 --- a/src/widgets/PipelineRunActionsMenu/components/CustomActionsInlineList/index.tsx +++ b/src/widgets/PipelineRunActionsMenu/components/CustomActionsInlineList/index.tsx @@ -1,16 +1,16 @@ import { Icon } from '@iconify/react'; import { - ButtonGroup, - ClickAwayListener, - Grow, - ListItemIcon, - ListItemText, - MenuItem, - MenuList, - Paper, - Popper, - Stack, - useTheme, + ButtonGroup, + ClickAwayListener, + Grow, + ListItemIcon, + ListItemText, + MenuItem, + MenuList, + Paper, + Popper, + Stack, + useTheme, } from '@mui/material'; import React from 'react'; import { ActionsInlineList } from '../../../../components/ActionsInlineList'; diff --git a/src/widgets/PodsLogViewer/types.ts b/src/widgets/PodsLogViewer/types.ts index 5031fdb4..81e4a650 100644 --- a/src/widgets/PodsLogViewer/types.ts +++ b/src/widgets/PodsLogViewer/types.ts @@ -1,4 +1,4 @@ -import { PodKubeObjectInterface } from "../../k8s/groups/default/Pod/types"; +import { PodKubeObjectInterface } from '../../k8s/groups/default/Pod/types'; export interface PodsLogViewerProps { pods: PodKubeObjectInterface[];