mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-29 06:15:29 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Code improvements (#1086)

Browse source 
* Extract code into hook
* Refactor code to remove let
* Reformat code
* Extract version-info-modal into components
* Use main block in landinglayout
* Add fixedWidth and classname attribute to IconButton

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
Tilman Vatteroth 2021-03-10 22:45:05 +01:00 • committed by GitHub
parent 029295dd3b
commit 107f0f6fa3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 192 additions and 142 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/common/icon-button/icon-button.tsx
View file

@ -1,7 +1,7 @@
/*
SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
SPDX-License-Identifier: AGPL-3.0-only
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import React from 'react'
@ -15,14 +15,15 @@ export interface IconButtonProps extends ButtonProps {
icon: IconName
onClick?: () => void
border?: boolean
iconFixedWidth?: boolean
}
export const IconButton: React.FC<IconButtonProps> = ({ icon, children, border = false, ...props }) => {
export const IconButton: React.FC<IconButtonProps> = ({ icon, children, iconFixedWidth = false, border = false, className, ...props }) => {
return (
<Button { ...props }
className={ `btn-icon p-0 d-inline-flex align-items-stretch ${ border ? 'with-border' : '' }` }>
className={ `btn-icon p-0 d-inline-flex align-items-stretch ${ border ? 'with-border' : '' } ${ className ?? '' }` }>
<span className="icon-part d-flex align-items-center">
<ForkAwesomeIcon icon={ icon } className={ 'icon' }/>
<ForkAwesomeIcon icon={ icon } fixedWidth={ iconFixedWidth } className={ 'icon' }/>
</span>
<ShowIf condition={ !!children }>
<span className="text-part d-flex align-items-center">

16
src/components/common/links/internal-link.tsx
View file

@ -1,7 +1,7 @@
/*
SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
SPDX-License-Identifier: AGPL-3.0-only
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import React from 'react'
@ -13,11 +13,11 @@ import { LinkWithTextProps } from './types'
export const InternalLink: React.FC<LinkWithTextProps> = ({ href, text, icon, id, className = 'text-light', title }) => {
return (
<Link to={ href }
className={ className }
id={ id }
title={ title }
>
<Link
to={ href }
className={ className }
id={ id }
title={ title }>
<ShowIf condition={ !!icon }>
<ForkAwesomeIcon icon={ icon as IconName } fixedWidth={ true }/>&nbsp;
</ShowIf>

11
src/components/common/modals/common-modal.tsx
View file

@ -1,7 +1,7 @@
/*
SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
SPDX-License-Identifier: AGPL-3.0-only
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import React from 'react'
@ -20,13 +20,14 @@ export interface CommonModalProps {
icon?: IconName
size?: 'lg' | 'sm' | 'xl'
additionalClasses?: string
'data-cy'?: string
}
export const CommonModal: React.FC<CommonModalProps> = ({ show, onHide, titleI18nKey, title, closeButton, icon, additionalClasses, size, children }) => {
export const CommonModal: React.FC<CommonModalProps> = ({ show, onHide, titleI18nKey, title, closeButton, icon, additionalClasses, size, children, ...props }) => {
useTranslation()
return (
<Modal data-cy={ 'limitReachedModal' } show={ show } onHide={ onHide } animation={ true }
<Modal data-cy={ props['data-cy'] } show={ show } onHide={ onHide } animation={ true }
dialogClassName={ `text-dark ${ additionalClasses ?? '' }` } size={ size }>
<Modal.Header closeButton={ !!closeButton }>
<Modal.Title>