Skip to content

Commit

Permalink
display switch to space only when space is not active space
Browse files Browse the repository at this point in the history
  • Loading branch information
eokoneyo committed Jun 10, 2024
1 parent a8aa3c8 commit e9b20ac
Show file tree
Hide file tree
Showing 2 changed files with 76 additions and 71 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -256,9 +256,7 @@ export class FeatureTable extends Component<Props, {}> {
}

updatedSpace.disabledFeatures = disabledFeatures;
if (this.props.onChange) {
this.props.onChange(updatedSpace);
}
this.props.onChange?.(updatedSpace);
};

private getAllFeatureIds = () =>
Expand Down Expand Up @@ -287,9 +285,7 @@ export class FeatureTable extends Component<Props, {}> {
);
}

if (this.props.onChange) {
this.props.onChange(updatedSpace);
}
this.props.onChange?.(updatedSpace);
};

private getCategoryHelpText = (category: AppCategory) => {
Expand Down
139 changes: 74 additions & 65 deletions x-pack/plugins/spaces/public/management/view_space/view_space.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,12 +16,14 @@ import {
EuiTab,
EuiTabs,
EuiText,
EuiTitle,
} from '@elastic/eui';
import React, { lazy, Suspense, useEffect, useState } from 'react';
import type { FC } from 'react';

import type { ApplicationStart, Capabilities, ScopedHistory } from '@kbn/core/public';
import type { FeaturesPluginStart, KibanaFeature } from '@kbn/features-plugin/public';
import { FormattedMessage } from '@kbn/i18n-react';
import { reactRouterNavigate } from '@kbn/kibana-react-plugin/public';
import type { Role } from '@kbn/security-plugin-types-common';

Expand Down Expand Up @@ -76,6 +78,7 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
const [activeSpaceId, setActiveSpaceId] = useState<string | null>(null);
const selectedTabId = getSelectedTabId(_selectedTabId);
const [space, setSpace] = useState<Space | null>(null);
const [userActiveSpace, setUserActiveSpace] = useState<Space | null>(null);
const [features, setFeatures] = useState<KibanaFeature[] | null>(null);
const [roles, setRoles] = useState<Role[]>([]);
const [isLoadingSpace, setIsLoadingSpace] = useState(true);
Expand All @@ -94,27 +97,21 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
if (!spaceId) {
return;
}
const getSpace = async () => {
const result = await spacesManager.getSpace(spaceId);
if (!result) {
throw new Error(`Could not get resulting space by id ${spaceId}`);
}
setSpace(result);

const getSpaceInfo = async () => {
const [activeSpace, currentSpace] = await Promise.all([
spacesManager.getActiveSpace(),
spacesManager.getSpace(spaceId),
]);

setSpace(currentSpace);
setUserActiveSpace(activeSpace);
setIsLoadingSpace(false);
};

getSpace().catch(handleApiError);
getSpaceInfo().catch(handleApiError);
}, [spaceId, spacesManager]);

useEffect(() => {
const _getFeatures = async () => {
const result = await getFeatures();
setFeatures(result);
setIsLoadingFeatures(false);
};
_getFeatures().catch(handleApiError);
}, [getFeatures]);

useEffect(() => {
if (spaceId) {
const getRoles = async () => {
Expand All @@ -127,14 +124,25 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
}
}, [spaceId, spacesManager]);

useEffect(() => {
const _getFeatures = async () => {
const result = await getFeatures();
setFeatures(result);
setIsLoadingFeatures(false);
};
_getFeatures().catch(handleApiError);
}, [getFeatures]);

useEffect(() => {
if (space) {
onLoadSpace?.(space);
}
}, [onLoadSpace, space]);

if (!space) {
return null;
}

if (onLoadSpace) {
onLoadSpace(space);
}

if (isLoadingSpace || isLoadingFeatures || isLoadingRoles) {
return (
<EuiFlexGroup justifyContent="spaceAround">
Expand All @@ -146,27 +154,9 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
}

const HeaderAvatar = () => {
return space.imageUrl != null ? (
<Suspense fallback={<EuiLoadingSpinner />}>
<LazySpaceAvatar
space={{
...space,
initials: space.initials ?? 'X',
name: undefined,
}}
size="xl"
/>
</Suspense>
) : (
return (
<Suspense fallback={<EuiLoadingSpinner />}>
<LazySpaceAvatar
space={{
...space,
name: space.name ?? 'Y',
imageUrl: undefined,
}}
size="xl"
/>
<LazySpaceAvatar space={space} size="xl" />
</Suspense>
);
};
Expand All @@ -184,7 +174,9 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
navigateToUrl(href);
}}
>
<EuiButtonEmpty iconType="gear">Settings</EuiButtonEmpty>
<EuiButtonEmpty iconType="gear">
<FormattedMessage id="viewSpace.spaceSettingsButton.label" defaultMessage="Settings" />
</EuiButtonEmpty>
</a>
) : null;
};
Expand All @@ -201,10 +193,17 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
`${ENTER_SPACE_PATH}?next=/app/management/kibana/spaces/view/${space.id}`
);

if (userActiveSpace?.id === space.id) {
return null;
}

// use href to force full page reload (needed in order to change spaces)
return (
<EuiButton iconType="merge" href={urlToSelectedSpace}>
Switch to this space
<FormattedMessage
id="viewSpace.switchToSpaceButton.label"
defaultMessage="Switch to this space"
/>
</EuiButton>
);
};
Expand All @@ -222,13 +221,19 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
<HeaderAvatar />
</EuiFlexItem>
<EuiFlexItem>
<h1>{space.name}</h1>
<p>
<small>
{space.description ??
'Organize your saved objects and show related features for creating new content.'}
</small>
</p>
<EuiTitle size="l">
<h1>{space.name}</h1>
</EuiTitle>
<EuiText size="s">
<p>
{space.description ?? (
<FormattedMessage
id="viewSpace.description"
defaultMessage="Organize your saved objects and show related features for creating new content."
/>
)}
</p>
</EuiText>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiFlexGroup alignItems="center">
Expand All @@ -244,22 +249,26 @@ export const ViewSpacePage: FC<PageProps> = (props) => {

<EuiSpacer />

<EuiTabs>
{tabs.map((tab, index) => (
<EuiTab
key={index}
isSelected={tab.id === selectedTabId}
append={tab.append}
{...reactRouterNavigate(history, `/view/${encodeURIComponent(space.id)}/${tab.id}`)}
>
{tab.name}
</EuiTab>
))}
</EuiTabs>

<EuiSpacer />

{selectedTabContent ?? null}
<EuiFlexGroup direction="column">
<EuiFlexItem>
<EuiTabs>
{tabs.map((tab, index) => (
<EuiTab
key={index}
isSelected={tab.id === selectedTabId}
append={tab.append}
{...reactRouterNavigate(
history,
`/view/${encodeURIComponent(space.id)}/${tab.id}`
)}
>
{tab.name}
</EuiTab>
))}
</EuiTabs>
</EuiFlexItem>
<EuiFlexItem>{selectedTabContent ?? null}</EuiFlexItem>
</EuiFlexGroup>
</EuiText>
</ViewSpaceContextProvider>
);
Expand Down

0 comments on commit e9b20ac

Please sign in to comment.