Files
overleaf-cep/services/web/frontend/js/features/group-management/components/request-status.tsx
T
Rebeka Dekany d751b88e6b Bootstrap files and folders cleanup (#27692)
* Remove icons folder

* Create folders for badge, button, and dropdown components

* Remove Bootstrap 5 from test

* Rename `getBootstrap5Breakpoint` to `getBootstrapBreakpoint`

* Cleanup and update BS 5 comments

* Move components to the shared folder

* Rename `tooltips-bs5` to `tooltip`

* Remove `-bs5` suffix

* Fix path

* Delete BS3 version file

* Rename `_form_marketing-bootstrap-5` to `_form_marketing`

* Delete BS3 version file

* Rename `_contact_general_modal-marketing-bootstrap-5` to `_contact_general_modal-marketing`

* Delete BS3 version file

* Rename `_contact_modal-marketing-bootstrap-5` to `_contact_modal-marketing`

* Delete BS3 version file

* Rename `thin-footer-bootstrap-5` to `thin-footer`

* Delete BS3 version file

* Rename `language-picker-bootstrap-5` to `language-picker`

* Rename `fat-footer-react-bootstrap-5` to `fat-footer-react`

* Delete BS3 version file

* Rename `navbar-marketing-bootstrap-5` to `navbar-marketing`

* Rename `navbar-marketing-react-bootstrap-5` to `navbar-marketing-react`

* Delete BS3 version file

* Rename `layout-website-redesign-cms-bootstrap-5` to `layout-website-redesign-cms`

* Source format

* Fix path

GitOrigin-RevId: cf0f5db7c84cf545c69213dcc271d9ff17fe5db7
2025-08-11 08:06:16 +00:00

65 lines
2.0 KiB
TypeScript

import { useTranslation } from 'react-i18next'
import { Card, CardBody, Row, Col } from 'react-bootstrap'
import Button from '@/shared/components/button/button'
import MaterialIcon from '@/shared/components/material-icon'
import getMeta from '@/utils/meta'
import IconButton from '@/shared/components/button/icon-button'
import classnames from 'classnames'
type RequestStatusProps = {
icon: string
title: string
content?: React.ReactNode
variant?: 'primary' | 'danger'
}
function RequestStatus({ icon, title, content, variant }: RequestStatusProps) {
const { t } = useTranslation()
const groupName = getMeta('ol-groupName')
return (
<div className="container">
<Row>
<Col xxl={5} xl={6} lg={7} md={9} className="mx-auto">
<div className="group-heading" data-testid="group-heading">
<IconButton
variant="ghost"
href="/user/subscription"
size="lg"
icon="arrow_back"
accessibilityLabel={t('back_to_subscription')}
/>
<h2>{groupName || t('group_subscription')}</h2>
</div>
<Card>
<CardBody className="d-grid gap-3">
<div
className={classnames('card-icon', {
[`text-${variant}`]: variant,
})}
>
<MaterialIcon type={icon} />
</div>
<div className="d-grid gap-2 text-center">
<h3 className="mb-0 fw-bold" data-testid="title">
{title}
</h3>
{content && (
<div className="card-description-secondary">{content}</div>
)}
</div>
<div className="text-center">
<Button variant="secondary" href="/user/subscription">
{t('go_to_subscriptions')}
</Button>
</div>
</CardBody>
</Card>
</Col>
</Row>
</div>
)
}
export default RequestStatus