Skip to content

Commit

Permalink
fix: adds margin to saml tab (#5104)
Browse files Browse the repository at this point in the history
  • Loading branch information
@tiagoapolo
tiagoapolo authored Feb 14, 2025
1 parent 13727d1 commit 6cffced
Showing 1 changed file with 110 additions and 108 deletions.
218 changes: 110 additions & 108 deletions frontend/web/components/SamlTab.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import CreateSAML from './modals/CreateSAML'
import Switch from './Switch'
import { SAMLConfiguration } from 'common/types/responses'
import PlanBasedBanner from './PlanBasedAccess'

export type SamlTabType = {
organisationId: number
}
Expand All @@ -36,119 +36,121 @@ const SamlTab: FC<SamlTabType> = ({ organisationId }) => {
}

return (
<PlanBasedBanner feature={'SAML'} theme={'page'} className='mt-3'>
<PageTitle
title={'SAML Configurations'}
cta={
<Button
className='text-right'
onClick={() => {
openCreateSAML('Create SAML configuration', organisationId)
}}
>
{'Create a SAML configuration'}
</Button>
}
/>

<FormGroup className='mb-4'>
<PanelSearch
className='no-pad overflow-visible'
id='features-list'
renderSearchWithNoResults
itemHeight={65}
isLoading={false}
filterRow={(samlConf: SAMLConfiguration, search: string) =>
samlConf.name.toLowerCase().indexOf(search) > -1
}
header={
<Row className='table-header'>
<Flex className='table-column'>
<div className='font-weight-medium'>Configuration name</div>
</Flex>
<div
className='table-column d-none d-md-block'
style={{ width: '150px' }}
>
Allow IdP-initiated
</div>
<div style={{ width: 90 }} className='table-column'>
Action
</div>
</Row>
}
items={data?.results || []}
renderRow={(samlConf: SAMLConfiguration) => (
<Row
<PlanBasedBanner feature='SAML' theme='page'>
<div className='mt-4 mb-4'>
<PageTitle
title={'SAML Configurations'}
cta={
<Button
className='text-right'
onClick={() => {
openCreateSAML(
'Update SAML configuration',
organisationId,
samlConf.name,
)
openCreateSAML('Create SAML configuration', organisationId)
}}
space
className='list-item py-2 py-md-0 clickable cursor-pointer'
key={samlConf.name}
>
<Flex className='table-column px-3'>
<div className='font-weight-medium mb-1'>{samlConf.name}</div>
</Flex>
<div
className='table-column d-none d-md-flex gap-4 align-items-center'
style={{ width: '150px' }}
{'Create a SAML configuration'}
</Button>
}
/>

<FormGroup>
<PanelSearch
className='no-pad overflow-visible'
id='features-list'
renderSearchWithNoResults
itemHeight={65}
isLoading={false}
filterRow={(samlConf: SAMLConfiguration, search: string) =>
samlConf.name.toLowerCase().indexOf(search) > -1
}
header={
<Row className='table-header'>
<Flex className='table-column'>
<div className='font-weight-medium'>Configuration name</div>
</Flex>
<div
className='table-column d-none d-md-block'
style={{ width: '150px' }}
>
Allow IdP-initiated
</div>
<div style={{ width: 90 }} className='table-column'>
Action
</div>
</Row>
}
items={data?.results || []}
renderRow={(samlConf: SAMLConfiguration) => (
<Row
onClick={() => {
openCreateSAML(
'Update SAML configuration',
organisationId,
samlConf.name,
)
}}
space
className='list-item py-2 py-md-0 clickable cursor-pointer'
key={samlConf.name}
>
<Switch checked={samlConf.allow_idp_initiated} />
</div>
<div className='table-column' style={{ width: 90 }}>
<Button
id='delete-invite'
type='button'
onClick={(e) => {
openModal(
'Delete SAML configuration',
<div>
<Flex className='table-column px-3'>
<div className='font-weight-medium mb-1'>{samlConf.name}</div>
</Flex>
<div
className='table-column d-none d-md-flex gap-4 align-items-center'
style={{ width: '150px' }}
>
<Switch checked={samlConf.allow_idp_initiated} />
</div>
<div className='table-column' style={{ width: 90 }}>
<Button
id='delete-invite'
type='button'
onClick={(e) => {
openModal(
'Delete SAML configuration',
<div>
Are you sure you want to delete the SAML
configuration?
</div>
<div className='text-right'>
<Button
className='mr-2'
onClick={() => {
closeModal()
}}
>
Cancel
</Button>
<Button
theme='danger'
onClick={() => {
deleteSamlConfiguration({
name: samlConf.name,
}).then(() => {
toast('SAML configuration deleted')
<div>
Are you sure you want to delete the SAML
configuration?
</div>
<div className='text-right'>
<Button
className='mr-2'
onClick={() => {
closeModal()
})
}}
>
Delete
</Button>
</div>
</div>,
)
e.stopPropagation()
e.preventDefault()
}}
className='btn btn-with-icon'
>
<Icon name='trash-2' width={20} fill='#656D7B' />
</Button>
</div>
</Row>
)}
/>
</FormGroup>
}}
>
Cancel
</Button>
<Button
theme='danger'
onClick={() => {
deleteSamlConfiguration({
name: samlConf.name,
}).then(() => {
toast('SAML configuration deleted')
closeModal()
})
}}
>
Delete
</Button>
</div>
</div>,
)
e.stopPropagation()
e.preventDefault()
}}
className='btn btn-with-icon'
>
<Icon name='trash-2' width={20} fill='#656D7B' />
</Button>
</div>
</Row>
)}
/>
</FormGroup>
</div>
</PlanBasedBanner>
)
}
Expand Down

0 comments on commit 6cffced

Please sign in to comment.