External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-10 22:19:28 -02:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #11122 from nixocio/ui_issue_10942

Browse Source 
Update empty survey list
This commit is contained in:
Wambugu “Innocent” Kironji
2021-09-24 10:40:41 -04:00
committed by GitHub
parent b5dee61e57 3a776ccbff
commit d6ef84e9e2
2 changed files with 30 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
awx/ui/src/screens/Template/Survey/SurveyList.js
View File

@@ -1,19 +1,11 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { useRouteMatch } from 'react-router-dom'; import { Button } from '@patternfly/react-core';
import {
Button,
Title,
EmptyState,
EmptyStateIcon,
EmptyStateBody,
} from '@patternfly/react-core';
import { TableComposable, Thead, Tr, Th, Tbody } from '@patternfly/react-table'; import { TableComposable, Thead, Tr, Th, Tbody } from '@patternfly/react-table';
import { CubesIcon } from '@patternfly/react-icons';
import ContentLoading from 'components/ContentLoading';
import AlertModal from 'components/AlertModal'; import AlertModal from 'components/AlertModal';
import { ToolbarAddButton } from 'components/PaginatedTable'; import ContentEmpty from 'components/ContentEmpty';
import ContentLoading from 'components/ContentLoading';
import useSelected from 'hooks/useSelected'; import useSelected from 'hooks/useSelected';
import SurveyListItem from './SurveyListItem'; import SurveyListItem from './SurveyListItem';
@@ -29,8 +21,6 @@ function SurveyList({
deleteSurvey, deleteSurvey,
canEdit, canEdit,
}) { }) {
const match = useRouteMatch();
const questions = survey?.spec || []; const questions = survey?.spec || [];
const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
const [isOrderModalOpen, setIsOrderModalOpen] = useState(false); const [isOrderModalOpen, setIsOrderModalOpen] = useState(false);
@@ -109,10 +99,10 @@ function SurveyList({
<Thead> <Thead>
<Tr> <Tr>
<Th /> <Th />
<Th datalabel={t`Name`}>{t`Name`}</Th> <Th dataLabel={t`Name`}>{t`Name`}</Th>
<Th datalabel={t`Type`}>{t`Type`}</Th> <Th dataLabel={t`Type`}>{t`Type`}</Th>
<Th datalabel={t`Default`}>{t`Default`}</Th> <Th dataLabel={t`Default`}>{t`Default`}</Th>
<Th datalabel={t`Actions`}>{t`Actions`}</Th> <Th dataLabel={t`Actions`}>{t`Actions`}</Th>
</Tr> </Tr>
</Thead> </Thead>
<Tbody> <Tbody>
@@ -148,16 +138,14 @@ function SurveyList({
); );
} }
if ((!questions || questions?.length <= 0) && !isLoading) { const emptyList = !questions || questions?.length <= 0;
return (
<EmptyState variant="full"> if (emptyList && !isLoading) {
<EmptyStateIcon icon={CubesIcon} /> content = (
<Title size="lg" headingLevel="h3"> <ContentEmpty
{t`No survey questions found.`} message={t`Please add survey questions.`}
</Title> title={t`No survey questions found.`}
<EmptyStateBody>{t`Please add survey questions.`}</EmptyStateBody> />
<ToolbarAddButton isDisabled={!canEdit} linkTo={`${match.url}/add`} />
</EmptyState>
); );
} }
return ( return (
@@ -175,6 +163,7 @@ function SurveyList({
onToggleSurvey={toggleSurvey} onToggleSurvey={toggleSurvey}
isDeleteDisabled={selected?.length === 0} isDeleteDisabled={selected?.length === 0}
canEdit={canEdit} canEdit={canEdit}
emptyList={emptyList}
onToggleDeleteModal={() => setIsDeleteModalOpen(true)} onToggleDeleteModal={() => setIsDeleteModalOpen(true)}
/> />
{content} {content}

25
awx/ui/src/screens/Template/Survey/SurveyToolbar.js
View File

@@ -32,6 +32,7 @@ function SurveyToolbar({
isDeleteDisabled, isDeleteDisabled,
onToggleDeleteModal, onToggleDeleteModal,
onOpenOrderModal, onOpenOrderModal,
emptyList,
}) { }) {
isDeleteDisabled = !canEdit || isDeleteDisabled; isDeleteDisabled = !canEdit || isDeleteDisabled;
const match = useRouteMatch(); const match = useRouteMatch();
@@ -94,17 +95,19 @@ function SurveyToolbar({
</Tooltip> </Tooltip>
</ToolbarItem> </ToolbarItem>
</ToolbarGroup> </ToolbarGroup>
<SwitchWrapper> {!emptyList && (
<Switch <SwitchWrapper>
aria-label={t`Survey Toggle`} <Switch
id="survey-toggle" aria-label={t`Survey Toggle`}
label={t`Survey Enabled`} id="survey-toggle"
labelOff={t`Survey Disabled`} label={t`Survey Enabled`}
isChecked={surveyEnabled} labelOff={t`Survey Disabled`}
isDisabled={!canEdit} isChecked={surveyEnabled}
onChange={() => onToggleSurvey(!surveyEnabled)} isDisabled={!canEdit}
/> onChange={() => onToggleSurvey(!surveyEnabled)}
</SwitchWrapper> />
</SwitchWrapper>
)}
</ToolbarContent> </ToolbarContent>
</Toolbar> </Toolbar>
); );