const BaseButtonLink = styled(BaseLink)`
${buttonStyle}
+
+ /*
+ Workaround to apply disable style to button-link
+ as link does not have disabled attribute, using props instead
+ */
+
+ ${({ disabled, theme }) =>
+ disabled
+ ? `&, &:hover, &:focus, &:active {
+ color: ${themeContrast('buttonDisabled')({ theme })};
+ background-color: ${themeColor('buttonDisabled')({ theme })};
+ border: ${themeBorder('default', 'buttonDisabledBorder')({ theme })};
+ cursor: not-allowed;
+ }`
+ : undefined};
`;
const BaseButton = styled.button`
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2024 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+import { render, screen } from '@testing-library/react';
+import { ButtonPrimary } from '../ButtonPrimary';
+
+it('renders ButtonPrimary correctly', () => {
+ render(<ButtonPrimary>Hello</ButtonPrimary>);
+ expect(screen.getByRole('button', { name: 'Hello' })).toBeInTheDocument();
+});
+
+it('renders ButtonPrimary correctly when to is defined', () => {
+ render(
+ <ButtonPrimary download="http://link.com" to="http://link.com">
+ Hello
+ </ButtonPrimary>,
+ );
+ expect(screen.queryByRole('button', { name: 'Hello' })).not.toBeInTheDocument();
+ expect(screen.getByRole('link', { name: 'Hello' })).toBeInTheDocument();
+});
'/admin/users',
'/admin/settings/encryption',
'/admin/extension/license/support',
+ '/admin/audit',
];
export default function GlobalContainer() {
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
+
import { subDays } from 'date-fns';
+import {
+ DateRangePicker,
+ LargeCenteredLayout,
+ Link,
+ PageContentFontWrapper,
+ PopupZLevel,
+ RadioButton,
+ Title,
+} from 'design-system';
import * as React from 'react';
import { Helmet } from 'react-helmet-async';
import { FormattedMessage } from 'react-intl';
-import Link from '../../../components/common/Link';
-import DateRangeInput from '../../../components/controls/DateRangeInput';
-import Radio from '../../../components/controls/Radio';
import Suggestions from '../../../components/embed-docs-modal/Suggestions';
import { now } from '../../../helpers/dates';
import { translate } from '../../../helpers/l10n';
const { dateRange, downloadStarted, housekeepingPolicy, selection } = props;
return (
- <main className="page page-limited" id="marketplace-page">
- <Suggestions suggestions="audit-logs" />
- <Helmet title={translate('audit_logs.page')} />
-
- <header className="page-header">
- <h2 className="page-title">{translate('audit_logs.page')}</h2>
- </header>
-
- <p className="big-spacer-bottom">
- {translate('audit_logs.page.description.1')}
- <br />
- <FormattedMessage
- id="audit_logs.page.description.2"
- defaultMessage={translate('audit_logs.page.description.2')}
- values={{
- housekeeping: translate('audit_logs.housekeeping_policy', housekeepingPolicy),
- link: (
- <Link
- to={{
- pathname: '/admin/settings',
- search: queryToSearch({ category: 'housekeeping' }),
- hash: '#auditLogs',
- }}
- >
- {translate('audit_logs.page.description.link')}
- </Link>
- ),
- }}
- />
- </p>
-
- <div className="huge-spacer-bottom">
- <h3 className="big-spacer-bottom">{translate('audit_logs.download')}</h3>
-
- <ul>
- {getRangeOptions(housekeepingPolicy).map((option) => (
- <li key={option} className="spacer-bottom">
- <Radio
- checked={selection === option}
- onCheck={props.handleOptionSelection}
- value={option}
- >
- {translate('audit_logs.range_option', option)}
- </Radio>
- </li>
- ))}
- </ul>
-
- <DateRangeInput
- onChange={props.handleDateSelection}
- minDate={subDays(now(), HOUSEKEEPING_POLICY_VALUES[housekeepingPolicy])}
- maxDate={now()}
- value={dateRange}
+ <LargeCenteredLayout as="main" id="audit-logs-page">
+ <PageContentFontWrapper className="sw-body-sm sw-my-8">
+ <Suggestions suggestions="audit-logs" />
+ <Helmet title={translate('audit_logs.page')} />
+
+ <Title>{translate('audit_logs.page')}</Title>
+
+ <p className="sw-mb-4">
+ {translate('audit_logs.page.description.1')}
+ <br />
+ <FormattedMessage
+ id="audit_logs.page.description.2"
+ defaultMessage={translate('audit_logs.page.description.2')}
+ values={{
+ housekeeping: translate('audit_logs.housekeeping_policy', housekeepingPolicy),
+ link: (
+ <Link
+ to={{
+ pathname: '/admin/settings',
+ search: queryToSearch({ category: 'housekeeping' }),
+ hash: '#auditLogs',
+ }}
+ >
+ {translate('audit_logs.page.description.link')}
+ </Link>
+ ),
+ }}
+ />
+ </p>
+
+ <div className="sw-mb-6">
+ <h3 className="sw-mb-4">{translate('audit_logs.download')}</h3>
+
+ <ul>
+ {getRangeOptions(housekeepingPolicy).map((option) => (
+ <li key={option} className="sw-mb-2">
+ <RadioButton
+ checked={selection === option}
+ onCheck={props.handleOptionSelection}
+ value={option}
+ >
+ {translate('audit_logs.range_option', option)}
+ </RadioButton>
+ </li>
+ ))}
+ </ul>
+
+ <DateRangePicker
+ className="sw-w-abs-350 sw-mt-4"
+ clearButtonLabel={translate('clear')}
+ fromLabel={translate('start_date')}
+ onChange={props.handleDateSelection}
+ separatorText={translate('to_')}
+ toLabel={translate('end_date')}
+ value={dateRange}
+ minDate={subDays(now(), HOUSEKEEPING_POLICY_VALUES[housekeepingPolicy])}
+ maxDate={now()}
+ zLevel={PopupZLevel.Content}
+ />
+ </div>
+
+ <DownloadButton
+ dateRange={dateRange}
+ downloadStarted={downloadStarted}
+ onStartDownload={props.handleStartDownload}
+ selection={selection}
/>
- </div>
-
- <DownloadButton
- dateRange={dateRange}
- downloadStarted={downloadStarted}
- onStartDownload={props.handleStartDownload}
- selection={selection}
- />
- </main>
+ </PageContentFontWrapper>
+ </LargeCenteredLayout>
);
}
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import classNames from 'classnames';
import { endOfDay, startOfDay, subDays } from 'date-fns';
+import { ButtonPrimary } from 'design-system/lib';
import * as React from 'react';
import { now } from '../../../helpers/dates';
import { translate } from '../../../helpers/l10n';
}).toString();
}
-export default function DownloadButton(props: DownloadButtonProps) {
+export default function DownloadButton(props: Readonly<DownloadButtonProps>) {
const { dateRange, downloadStarted, selection } = props;
const downloadDisabled =
return (
<>
- <a
- className={classNames('button button-primary', { disabled: downloadDisabled })}
+ <ButtonPrimary
download="audit_logs.json"
+ disabled={downloadDisabled}
aria-disabled={downloadDisabled}
onClick={downloadDisabled ? undefined : props.onStartDownload}
- href={downloadUrl}
- rel="noopener noreferrer"
+ to={downloadUrl}
target="_blank"
>
{translate('download_verb')}
- </a>
+ </ButtonPrimary>
{downloadStarted && (
- <div className="spacer-top">
+ <div className="sw-mt-2">
<p>{translate('audit_logs.download_start.sentence.1')}</p>
<p>{translate('audit_logs.download_start.sentence.2')}</p>
<br />
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import { screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { getDate, getMonth, getYear, subDays } from 'date-fns';
import SettingsServiceMock from '../../../../api/mocks/SettingsServiceMock';
import { now } from '../../../../helpers/dates';
-import { getMonthName } from '../../../../helpers/l10n';
+import { getShortMonthName } from '../../../../helpers/l10n';
import { renderAppWithAdminContext } from '../../../../helpers/testReactTestingUtils';
-import { byPlaceholderText, byRole, byText } from '../../../../helpers/testSelector';
+import { byPlaceholderText, byRole, byTestId, byText } from '../../../../helpers/testSelector';
import { AdminPageExtension } from '../../../../types/extension';
import { SettingsKey } from '../../../../types/settings';
import routes from '../../routes';
downloadSentenceStart: byText('audit_logs.download_start.sentence.1'),
startDateInput: byPlaceholderText('start_date'),
endDateInput: byPlaceholderText('end_date'),
- dateInputMonthSelect: byRole('combobox', { name: 'Month:' }),
- dateInputYearSelect: byRole('combobox', { name: 'Year:' }),
+ dateInputMonthSelect: byTestId('month-select'),
+ dateInputYearSelect: byTestId('year-select'),
};
let handler: SettingsServiceMock;
await user.click(ui.customRadio.get());
expect(ui.downloadButton.get()).toHaveAttribute('aria-disabled', 'true');
await user.click(ui.startDateInput.get());
+ const monthSelector = ui.dateInputMonthSelect.byRole('combobox').get();
+ await user.click(monthSelector);
+ await user.click(
+ ui.dateInputMonthSelect
+ .byText(getShortMonthName(getMonth(startDay)))
+ .getAll()
+ .slice(-1)[0],
+ );
+
+ const yearSelector = ui.dateInputYearSelect.byRole('combobox').get();
+ await user.click(yearSelector);
+ await user.click(
+ ui.dateInputYearSelect.byText(getYear(startDay).toString()).getAll().slice(-1)[0],
+ );
+
+ await user.click(byText(getDate(startDay), { selector: 'button' }).get());
- await user.selectOptions(ui.dateInputMonthSelect.get(), getMonthName(getMonth(startDay)));
- await user.selectOptions(ui.dateInputYearSelect.get(), getYear(startDay).toString());
- await user.click(screen.getByText(getDate(startDay)));
await user.click(ui.endDateInput.get());
- await user.selectOptions(ui.dateInputMonthSelect.get(), getMonthName(getMonth(endDate)));
- await user.selectOptions(ui.dateInputYearSelect.get(), getYear(endDate).toString());
- await user.click(screen.getByText(getDate(endDate)));
+ await user.click(monthSelector);
+ await user.click(
+ ui.dateInputMonthSelect
+ .byText(getShortMonthName(getMonth(endDate)))
+ .getAll()
+ .slice(-1)[0],
+ );
+
+ await user.click(yearSelector);
+ await user.click(
+ ui.dateInputYearSelect.byText(getYear(endDate).toString()).getAll().slice(-1)[0],
+ );
+
+ await user.click(byText(getDate(endDate), { selector: 'button' }).get());
expect(await ui.downloadButton.find()).toHaveAttribute('aria-disabled', 'false');
await user.click(downloadButton);
projects / sonarqube.git / commitdiff