Skip to content

Commit

Permalink
Sync changes with new button component.
Browse files Browse the repository at this point in the history 
Co-authored-by: Jeremiah Uy <[email protected]>
Co-authored-by: Shayan <[email protected]>
  • Loading branch information
@andregroseth @JeremiahUy @shayany
3 people committed Oct 13, 2023
1 parent 4da3f15 commit c917344
Show file tree
Hide file tree
Showing 12 changed files with 41 additions and 42 deletions.
9 changes: 5 additions & 4 deletions apps/frontend/src/components/Navigation/Burger/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,15 @@ import { user } from '../../../services/User'
import { faBars, faTimes } from '@fortawesome/free-solid-svg-icons'
import { ettlevColors } from '../../../util/theme'
import { arkPennIcon, exitIcon, grafIcon, husIcon, paragrafIcon } from '../../Images'
import { LeaveIcon, MenuHamburgerIcon, XMarkIcon } from '@navikt/aksel-icons'

const Brand = () => (
<StyledLink style={{ textDecoration: 'none' }} href="/">
<HeadingXLarge color={ettlevColors.green800}>Støtte til etterlevelse</HeadingXLarge>
</StyledLink>
)

const MenuItem = (props: { to: string, text: string, icon: string, setShowMenu: Function }) => (
const MenuItem = (props: { to: string; text: string; icon: string; setShowMenu: Function }) => (
<Block
display={'flex'}
alignItems={'center'}
Expand Down Expand Up @@ -60,7 +61,7 @@ const SignOutButton = (props: { location: string }) => {
const linkCss = useCss({ textDecoration: 'none', color: 'white' })
return (
<StyledLink href={`${env.backendBaseUrl}/logout?redirect_uri=${props.location}`} className={linkCss}>
<Button kind="secondary" startEnhancer={<img src={exitIcon} alt="exit icon" />}>
<Button kind="secondary" icon={<LeaveIcon />}>
Logg ut
</Button>
</StyledLink>
Expand All @@ -80,7 +81,7 @@ const BurgerMenu = () => {
return (
<React.Fragment>
{!showMenu && (
<Button kind="secondary" size="compact" onClick={() => setShowMenu(true)} icon={faBars}>
<Button kind="secondary" size="small" onClick={() => setShowMenu(true)} icon={<MenuHamburgerIcon />}>
Meny
</Button>
)}
Expand Down Expand Up @@ -109,7 +110,7 @@ const BurgerMenu = () => {
>
<Block display="flex" flexDirection="column" height="100%">
<Block width="100%" display="flex" justifyContent="flex-end" marginBottom={theme.sizing.scale1600}>
<Button kind="secondary" size="compact" onClick={() => setShowMenu(false)} icon={faTimes}>
<Button kind="secondary" size="small" onClick={() => setShowMenu(false)} icon={<XMarkIcon />}>
Meny
</Button>
</Block>
Expand Down
3 changes: 2 additions & 1 deletion apps/frontend/src/components/admin/CodeList/CodelistPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import CreateCodeListModal from './ModalCreateCodeList'
import CodeListTable from './CodeListStyledTable'
import { ettlevColors, responsivePaddingSmall, responsiveWidthSmall } from '../../../util/theme'
import { Helmet } from 'react-helmet'
import { PlusIcon } from '@navikt/aksel-icons'

const CodeListPage = () => {
const params = useParams<{ listname?: string }>()
Expand Down Expand Up @@ -87,7 +88,7 @@ const CodeListPage = () => {
</Block>
{listname && (
<Block>
<Button tooltip="Legg til ny" icon={faPlus} size={ButtonSize.compact} kind={KIND.tertiary} onClick={() => setCreateCodeListModal(!createCodeListModal)}>
<Button tooltip="Legg til ny" icon={<PlusIcon/>} size={"small"} kind={"tertiary"} onClick={() => setCreateCodeListModal(!createCodeListModal)}>
Opprett ny kode
</Button>
</Block>
Expand Down
5 changes: 3 additions & 2 deletions apps/frontend/src/components/admin/audit/AuditButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { user } from '../../../services/User'
import RouteLink from '../../common/RouteLink'
import Button from '../../common/Button'
import { intl } from '../../../util/intl/intl'
import { ClockDashedIcon } from '@navikt/aksel-icons'

export const AuditButton = (props: {
id: string
Expand All @@ -27,9 +28,9 @@ export const AuditButton = (props: {
tooltip={intl.version}
marginLeft={props.marginLeft}
marginRight={props.marginRight}
size={ButtonSize.compact}
size={"small"}
kind={props.kind || 'outline'}
label={'Versjonering'}
icon={<ClockDashedIcon title="Versjonering"/>}
>
<FontAwesomeIcon icon={faHistory} />
</Button>
Expand Down
8 changes: 4 additions & 4 deletions apps/frontend/src/components/admin/audit/AuditView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,14 +54,14 @@ export const AuditView = (props: AuditViewProps) => {
<Label label={intl.audits}>{auditLog?.audits.length}</Label>
</Block>
<Block display="flex">
<Button size="compact" kind="tertiary" marginRight onClick={() => setOpenAll(!openAll)}>
<Button size="small" kind="tertiary" marginRight onClick={() => setOpenAll(!openAll)}>
{openAll ? 'Lukke' : 'Åpne'} alle
</Button>
{newestAudit?.action !== AuditAction.DELETE && (
<StatefulTooltip content={() => intl.view} placement={PLACEMENT.top}>
<Block>
<ObjectLink id={newestAudit!.tableId} type={newestAudit!.table} audit={newestAudit}>
<Button size="compact" shape="round" kind="tertiary">
<Button size="small" kind="tertiary">
<FontAwesomeIcon icon={faBinoculars} />
</Button>
</ObjectLink>
Expand All @@ -70,7 +70,7 @@ export const AuditView = (props: AuditViewProps) => {
)}
<StatefulTooltip content={() => intl.close} placement={PLACEMENT.top}>
<Block>
<Button size="compact" shape="round" kind="tertiary" onClick={() => viewId('')}>
<Button size="small" kind="tertiary" onClick={() => viewId('')}>
<FontAwesomeIcon icon={faTimes} />
</Button>
</Block>
Expand Down Expand Up @@ -118,7 +118,7 @@ export const AuditView = (props: AuditViewProps) => {
}}
>
<div>
<Button size="compact" shape="round" kind="tertiary">
<Button size="small" kind="tertiary">
<FontAwesomeIcon icon={faExchangeAlt} />
</Button>
</div>
Expand Down
15 changes: 8 additions & 7 deletions apps/frontend/src/components/krav/tilbakemelding/Tilbakemelding.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ import { Select, SIZE } from 'baseui/select'
import { customSelectOverrides } from '../Edit/RegelverkEdit'
import { Checkbox } from 'baseui/checkbox'
import { ShowWarningMessage } from '../../etterlevelseDokumentasjonTema/KravCard'
import { PlusIcon, TrashIcon } from '@navikt/aksel-icons'

const DEFAULT_COUNT_SIZE = 5

Expand Down Expand Up @@ -207,7 +208,7 @@ export const Tilbakemeldinger = ({ krav, hasKravExpired }: { krav: Krav; hasKrav

{tilbakemeldinger.length > DEFAULT_COUNT_SIZE && (
<Block $style={{ alignSelf: 'flex-end' }} marginTop={theme.sizing.scale400}>
<Button kind="tertiary" size="compact" icon={faPlus} onClick={() => setCount(count + DEFAULT_COUNT_SIZE)} disabled={tilbakemeldinger.length <= count}>
<Button kind="tertiary" size="small" icon={<PlusIcon/>} onClick={() => setCount(count + DEFAULT_COUNT_SIZE)} disabled={tilbakemeldinger.length <= count}>
Last flere
</Button>
</Block>
Expand All @@ -233,7 +234,7 @@ export const Tilbakemeldinger = ({ krav, hasKravExpired }: { krav: Krav; hasKrav
)}

{user.canWrite() && (
<Button kind={'primary'} size="compact" onClick={() => setAddTilbakemelding(true)}>
<Button kind={'primary'} size="small" onClick={() => setAddTilbakemelding(true)}>
Still et spørsmål
</Button>
)}
Expand Down Expand Up @@ -396,12 +397,12 @@ const TilbakemeldingSvar = ({ tilbakemelding, setFocusNummer, close, ubesvartOgK
<ParagraphMedium $style={{ whiteSpace: 'pre-wrap', overflowWrap: 'break-word' }}>{tilbakemelding.meldinger[0].innhold}</ParagraphMedium>
</ModalBody>
<ModalFooter>
<Button kind={'secondary'} size={'compact'} onClick={() => setDeleteModal(false)}>
<Button kind={'secondary'} size={'small'} onClick={() => setDeleteModal(false)}>
Avbryt
</Button>
<Button
kind={'primary'}
size={'compact'}
size={'small'}
marginLeft
onClick={() =>
tilbakemeldingslettMelding({ tilbakemeldingId: tilbakemelding.id, meldingNr: 1 }).then((t) => {
Expand All @@ -419,7 +420,7 @@ const TilbakemeldingSvar = ({ tilbakemelding, setFocusNummer, close, ubesvartOgK
<Block display="flex" marginTop={'8px'} width={'100%'}>
{user.isAdmin() && (
<Block>
<Button size="compact" icon={faTrashAlt} kind={'secondary'} onClick={() => setDeleteModal(true)}>
<Button size="small" icon={<TrashIcon/>} kind={'secondary'} onClick={() => setDeleteModal(true)}>
Slett hele samtalen
</Button>
</Block>
Expand Down Expand Up @@ -453,7 +454,7 @@ const TilbakemeldingSvar = ({ tilbakemelding, setFocusNummer, close, ubesvartOgK
) : (
<Button
kind="secondary"
size={'compact'}
size={'small'}
marginLeft
onClick={() => {
setIsUpdatingStatus(true)
Expand All @@ -474,7 +475,7 @@ const TilbakemeldingSvar = ({ tilbakemelding, setFocusNummer, close, ubesvartOgK
)}
</Block>
)}
<Button kind="primary" size={'compact'} marginLeft disabled={!response} onClick={submit}>
<Button kind="primary" size={'small'} marginLeft disabled={!response} onClick={submit}>
{ubesvartOgKraveier ? 'Svar' : 'Send'}
{user.isKraveier() ? ' og oppdater status' : ''}
</Button>
Expand Down
9 changes: 5 additions & 4 deletions apps/frontend/src/components/krav/tilbakemelding/edit/MeldingKnapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { user } from '../../../../services/User'
import { pageWidth } from '../../../../util/theme'
import { PersonName } from '../../../common/PersonName'
import TilbakemeldingEdit from './TilbakemeldingEdit'
import { PencilIcon, TrashIcon } from '@navikt/aksel-icons'

export const MeldingKnapper = (props: {
melding: TilbakemeldingMelding
Expand All @@ -28,10 +29,10 @@ export const MeldingKnapper = (props: {
return (
<>
<Block marginLeft={props.marginLeft ? '42px' : undefined} width="50%">
<Button kind={'underline-hover'} size={'mini'} icon={faPencilAlt} onClick={() => setEditModal(true)}>
<Button kind={'underline-hover'} size={'xsmall'} icon={<PencilIcon/>} onClick={() => setEditModal(true)}>
Rediger
</Button>
<Button kind={'underline-hover'} size={'mini'} icon={faTrashAlt} marginLeft onClick={() => setDeleteModal(true)}>
<Button kind={'underline-hover'} size={'xsmall'} icon={<TrashIcon/>} marginLeft onClick={() => setDeleteModal(true)}>
Slett
</Button>
</Block>
Expand All @@ -47,12 +48,12 @@ export const MeldingKnapper = (props: {
<ParagraphMedium $style={{ whiteSpace: 'pre-wrap', overflowWrap: 'break-word' }}>{melding.innhold}</ParagraphMedium>
</ModalBody>
<ModalFooter>
<Button kind={'secondary'} size={'compact'} onClick={() => setDeleteModal(false)}>
<Button kind={'secondary'} size={'small'} onClick={() => setDeleteModal(false)}>
Avbryt
</Button>
<Button
kind={'primary'}
size={'compact'}
size={'small'}
marginLeft
onClick={() =>
tilbakemeldingslettMelding({ tilbakemeldingId, meldingNr }).then((t) => {
Expand Down
9 changes: 5 additions & 4 deletions apps/frontend/src/components/krav/tilbakemelding/edit/NyTilbakemeldingModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import { borderColor, borderRadius, borderWidth } from '../../../common/Style'
import { CustomizedAccordion, CustomizedPanel } from '../../../common/CustomizedAccordion'
import { Markdown } from '../../../common/Markdown'
import { Error } from '../../../common/ModalSchema'
import { EnvelopeClosedIcon, PersonIcon } from '@navikt/aksel-icons'

type NyTilbakemeldingModalProps = {
open?: boolean
Expand Down Expand Up @@ -176,21 +177,21 @@ export const NyTilbakemeldingModal = ({ open, close, krav }: NyTilbakemeldingMod
<Block display="flex" flexDirection="column" marginTop={theme.sizing.scale600}>
{adresseType === AdresseType.SLACK && <SlackChannelSearch add={setVarslingsadresse} />}
{adresseType !== AdresseType.SLACK && !values.varslingsadresse && (
<Button kind="secondary" size="compact" type="button" icon={faSlackHash} onClick={() => setAdresseType(AdresseType.SLACK)}>
<Button kind="secondary" size="small" type="button" icon={<FontAwesomeIcon icon={faSlackHash} />} onClick={() => setAdresseType(AdresseType.SLACK)}>
Slack-kanal
</Button>
)}
<Block marginTop={theme.sizing.scale400} />
{adresseType === AdresseType.SLACK_USER && <SlackUserSearch add={setVarslingsadresse} />}
{adresseType !== AdresseType.SLACK_USER && !values.varslingsadresse && (
<Button kind="secondary" size="compact" marginLeft type="button" icon={faUser} onClick={() => setAdresseType(AdresseType.SLACK_USER)}>
<Button kind="secondary" size="small" marginLeft type="button" icon={<PersonIcon/>} onClick={() => setAdresseType(AdresseType.SLACK_USER)}>
Slack-bruker
</Button>
)}
<Block marginTop={theme.sizing.scale400} />
{adresseType === AdresseType.EPOST && <AddEmail add={setVarslingsadresse} />}
{adresseType !== AdresseType.EPOST && !values.varslingsadresse && (
<Button kind="secondary" size="compact" marginLeft type="button" icon={faEnvelope} onClick={() => setAdresseType(AdresseType.EPOST)}>
<Button kind="secondary" size="small" marginLeft type="button" icon={<EnvelopeClosedIcon/>} onClick={() => setAdresseType(AdresseType.EPOST)}>
Epost
</Button>
)}
Expand Down Expand Up @@ -226,7 +227,7 @@ export const NyTilbakemeldingModal = ({ open, close, krav }: NyTilbakemeldingMod
</Notification>
)}
</Block>
<Button kind="secondary" size="compact" type="button" onClick={close}>
<Button kind="secondary" size="small" type="button" onClick={close}>
{' '}
Avbryt{' '}
</Button>
Expand Down
4 changes: 2 additions & 2 deletions apps/frontend/src/components/krav/tilbakemelding/edit/TilbakemeldingEdit.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,10 @@ export const TilbakemeldingEdit = ({
<Block alignItems="flex-end">
<CustomizedTextarea rows={15} onChange={(e) => setResponse((e.target as HTMLTextAreaElement).value)} value={response} disabled={loading} />
<Block marginTop={theme.sizing.scale400} display="flex" justifyContent={'flex-end'}>
<Button kind={'secondary'} size={'compact'} onClick={() => setEditModal(false)}>
<Button kind={'secondary'} size={'small'} onClick={() => setEditModal(false)}>
Avbryt
</Button>
<Button marginLeft size="compact" disabled={!response || loading} onClick={submit}>
<Button marginLeft size="small" disabled={!response || loading} onClick={submit}>
Lagre
</Button>
</Block>
Expand Down
3 changes: 2 additions & 1 deletion apps/frontend/src/components/kravList/AllKrav.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { faPlus } from '@fortawesome/free-solid-svg-icons'
import { KravPanels, sortKrav } from '../../pages/KravListPage'
import { borderColor } from '../common/Style'
import { kravStatus } from '../../pages/KravPage'
import { PlusIcon } from '@navikt/aksel-icons'

type KravFilter = {
status: Option[]
Expand Down Expand Up @@ -289,7 +290,7 @@ export const AllKrav = () => {
{!loading && kravene.totalElements !== 0 && (
<Block display={'flex'} justifyContent={'space-between'} marginTop={theme.sizing.scale1000}>
<Block display="flex" alignItems="center">
<Button onClick={lastMer} icon={faPlus} kind={'secondary'} size="compact" disabled={gqlLoading || kravene.numberOfElements >= kravene.totalElements}>
<Button onClick={lastMer} icon={<PlusIcon/>} kind={'secondary'} size="small" disabled={gqlLoading || kravene.numberOfElements >= kravene.totalElements}>
Vis mer
</Button>

Expand Down
2 changes: 1 addition & 1 deletion apps/frontend/src/components/kravList/TemaList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,7 @@ const KravTemaList = (props: { activeKraver: Krav[]; tema: string; refresh: Func
paddingRight: '16px',
}}
>
<Button kind="secondary" size="mini" onClick={() => setIsEditPriorityModalOpen(true)}>
<Button kind="secondary" size="small" onClick={() => setIsEditPriorityModalOpen(true)}>
Justere rekkefølgen på krav
</Button>
</Block>
Expand Down
4 changes: 2 additions & 2 deletions apps/frontend/src/components/kravList/edit/EditPriorityModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -249,7 +249,7 @@ export const EditPriorityModal = (props: { isOpen: boolean; setIsOpen: React.Dis
className="krav-list-button-container"
>
<Button
size="compact"
size="small"
kind="secondary"
onClick={() => {
refresh()
Expand All @@ -259,7 +259,7 @@ export const EditPriorityModal = (props: { isOpen: boolean; setIsOpen: React.Dis
>
Avbryt
</Button>
<Button size="compact" onClick={p.submitForm} disabled={loading} marginLeft>
<Button size="small" onClick={p.submitForm} disabled={loading} marginLeft>
Lagre
</Button>
</Block>
Expand Down
12 changes: 2 additions & 10 deletions apps/frontend/src/components/search/MainSearch.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import {clearSearchIcon, filterIcon, navChevronDownIcon, searchIcon} from '../Im
import {ParagraphMedium} from 'baseui/typography'
import {urlForObject} from '../common/RouteLink'
import {etterlevelseDokumentasjonName, searchEtterlevelsedokumentasjon} from '../../api/EtterlevelseDokumentasjonApi'
import { FilterIcon } from '@navikt/aksel-icons'

type SearchItem = { id: string; sortKey: string; label: ReactElement; type: NavigableItem | string }

Expand Down Expand Up @@ -84,21 +85,12 @@ const SelectType = (props: { type: SearchType; setType: (type: SearchType) => vo
<Button
size="xsmall"
onClick={() => setFilter(!filter)}
startEnhancer={<img alt="filter icon" src={filterIcon} />}
icon={<FilterIcon/>}
kind="tertiary"
marginRight
label="Filter søkeresultat"
notBold
>
<ParagraphMedium
$style={{
fontSize: theme.sizing.scale600,
marginTop: 0,
marginBottom: 0,
}}
>
Vis filter
</ParagraphMedium>
</Button>
</Block>
)}
Expand Down

0 comments on commit c917344

Please sign in to comment.