Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-08-04 21:35:23 +02:00
Code Issues Releases Activity

refactor(docker): migrate dashboard to react [EE-2191] (#11574)
Some checks are pending
ci / build_images (map[arch:ppc64le platform:linux version:]) (push) Waiting to run
ci / build_images (map[arch:s390x platform:linux version:]) (push) Waiting to run
ci / build_images (map[arch:amd64 platform:linux version:]) (push) Waiting to run
ci / build_images (map[arch:amd64 platform:windows version:1809]) (push) Waiting to run
ci / build_images (map[arch:amd64 platform:windows version:ltsc2022]) (push) Waiting to run
ci / build_images (map[arch:arm platform:linux version:]) (push) Waiting to run
ci / build_images (map[arch:arm64 platform:linux version:]) (push) Waiting to run
ci / build_manifests (push) Blocked by required conditions
/ triage (push) Waiting to run
Lint / Run linters (push) Waiting to run
Test / test-client (push) Waiting to run
Test / test-server (map[arch:amd64 platform:linux]) (push) Waiting to run
Test / test-server (map[arch:amd64 platform:windows version:1809]) (push) Waiting to run
Test / test-server (map[arch:amd64 platform:windows version:ltsc2022]) (push) Waiting to run
Test / test-server (map[arch:arm64 platform:linux]) (push) Waiting to run

Browse source
This commit is contained in:
Chaim Lev-Ari 2024-05-20 09:34:51 +03:00 • committed by GitHub
parent 2669a44d79
commit 014a590704
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
54 changed files with 1297 additions and 507 deletions
Download patch file Download diff file Expand all files Collapse all files

6
app/react/components/DashboardItem/DashboardItem.stories.tsx
View file

@ -24,7 +24,7 @@ function Template({ value, icon, type }: StoryProps) {
value={value}
icon={icon}
type={type}
dataCy="data-cy-example"
data-cy="data-cy-example"
/>
);
}
@ -43,7 +43,7 @@ export function WithLink() {
value={1}
icon={List}
type="Example resource"
dataCy="data-cy-example"
data-cy="data-cy-example"
/>
</Link>
);
@ -55,7 +55,7 @@ export function WithChildren() {
value={1}
icon={List}
type="Example resource"
dataCy="data-cy-example"
data-cy="data-cy-example"
>
<div>Children</div>
</DashboardItem>

2
app/react/components/DashboardItem/DashboardItem.test.tsx
View file

@ -27,6 +27,6 @@ test('should have accessibility label created from the provided resource type',
function renderComponent(value = 0, icon = User, type = '') {
return render(
<DashboardItem value={value} icon={icon} type={type} dataCy="example" />
<DashboardItem value={value} icon={icon} type={type} data-cy="example" />
);
}

6
app/react/components/DashboardItem/DashboardItem.tsx
View file

@ -4,10 +4,11 @@ import { Loader2 } from 'lucide-react';
import { Icon, IconProps } from '@/react/components/Icon';
import { pluralize } from '@/portainer/helpers/strings';
import { AutomationTestingProps } from '@/types';
import { Link } from '@@/Link';
interface Props extends IconProps {
interface Props extends IconProps, AutomationTestingProps {
type: string;
pluralType?: string; // in case the pluralise function isn't suitable
isLoading?: boolean;
@ -16,7 +17,6 @@ interface Props extends IconProps {
to?: string;
params?: object;
children?: ReactNode;
dataCy: string;
}
export function DashboardItem({
@ -29,7 +29,7 @@ export function DashboardItem({
to,
params,
children,
dataCy,
'data-cy': dataCy,
}: Props) {
const Item = (
<div

48
app/react/components/InformationPanel.tsx
View file

@ -19,33 +19,29 @@ export function InformationPanel({
children,
}: PropsWithChildren<Props>) {
return (
<div className="row">
<div className="col-sm-12">
<Widget>
<WidgetBody className={bodyClassName}>
<div style={wrapperStyle}>
{title && (
<div className="form-section-title">
<span>{title}</span>
{!!onDismiss && (
<span className="small" style={{ float: 'right' }}>
<Button
color="link"
icon={X}
onClick={() => onDismiss()}
data-cy="dismiss-information-panel-button"
>
dismiss
</Button>
</span>
)}
</div>
<Widget>
<WidgetBody className={bodyClassName}>
<div style={wrapperStyle}>
{title && (
<div className="form-section-title">
<span>{title}</span>
{!!onDismiss && (
<span className="small" style={{ float: 'right' }}>
<Button
color="link"
icon={X}
onClick={() => onDismiss()}
data-cy="dismiss-information-panel-button"
>
dismiss
</Button>
</span>
)}
<div>{children}</div>
</div>
</WidgetBody>
</Widget>
</div>
</div>
)}
<div>{children}</div>
</div>
</WidgetBody>
</Widget>
);
}