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

feat(frontend): replace forkawesome with bootstrap icons

Browse source 
These icon replace fork awesome. A linter informs the user about the deprecation.

See https://github.com/hedgedoc/hedgedoc/issues/2929

Co-authored-by: Philip Molares <philip.molares@udo.edu>
Co-authored-by: Tilman Vatteroth <git@tilmanvatteroth.de>
Signed-off-by: Philip Molares <philip.molares@udo.edu>
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Philip Molares 2023-02-05 22:05:02 +01:00 • committed by Tilman Vatteroth
parent e7246f1484
commit 1c16e25e14
179 changed files with 4974 additions and 1943 deletions
Download patch file Download diff file Expand all files Collapse all files

17
frontend/src/components/markdown-renderer/replace-components/click-shield/click-shield.tsx
View file

@ -6,14 +6,13 @@
import type { PropsWithDataCypressId } from '../../../../utils/cypress-attribute'
import { cypressId } from '../../../../utils/cypress-attribute'
import { Logger } from '../../../../utils/logger'
import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
import type { IconName } from '../../../common/fork-awesome/types'
import { ShowIf } from '../../../common/show-if/show-if'
import { ProxyImageFrame } from '../../extensions/image/proxy-image-frame'
import styles from './click-shield.module.scss'
import type { Property } from 'csstype'
import type { PropsWithChildren } from 'react'
import React, { useCallback, useEffect, useMemo, useState } from 'react'
import type { Icon } from 'react-bootstrap-icons'
import { Trans, useTranslation } from 'react-i18next'
const log = new Logger('OneClickEmbedding')
@ -21,7 +20,7 @@ const log = new Logger('OneClickEmbedding')
export interface ClickShieldProps extends PropsWithChildren<PropsWithDataCypressId> {
onImageFetch?: () => Promise<string>
fallbackPreviewImageUrl?: string
hoverIcon: IconName
hoverIcon: Icon
targetDescription: string
containerClassName?: string
fallbackBackgroundColor?: Property.BackgroundColor
@ -104,6 +103,16 @@ export const ClickShield: React.FC<ClickShieldProps> = ({
const hoverTextTranslationValues = useMemo(() => ({ target: targetDescription }), [targetDescription])
const icon = useMemo(
() =>
React.createElement(hoverIcon, {
width: '5em',
height: '5em',
className: 'mb-2'
}),
[hoverIcon]
)
return (
<span className={containerClassName} {...cypressId(props['data-cypress-id'])}>
<ShowIf condition={showChildren}>{children}</ShowIf>
@ -114,7 +123,7 @@ export const ClickShield: React.FC<ClickShieldProps> = ({
<span className={`${styles['preview-hover-text']}`}>
<Trans i18nKey={'renderer.clickShield.previewHoverText'} values={hoverTextTranslationValues} />
</span>
<ForkAwesomeIcon icon={hoverIcon} size={'5x'} className={'mb-2'} />
{icon}
</span>
</span>
</ShowIf>