From 70ada1d20b5f0b49e4cf58b4ad7a8737d63e6212 Mon Sep 17 00:00:00 2001 From: kolaente Date: Thu, 19 Feb 2026 14:56:28 +0100 Subject: [PATCH] refactor: remove FontAwesome infrastructure and global Icon component --- frontend/src/components/misc/Icon.ts | 206 ---------------------- frontend/src/histoire.setup.ts | 2 - frontend/src/main.ts | 2 - frontend/src/types/global-components.d.ts | 9 +- frontend/src/types/vue-fontawesome.ts | 40 ----- 5 files changed, 2 insertions(+), 257 deletions(-) delete mode 100644 frontend/src/components/misc/Icon.ts delete mode 100644 frontend/src/types/vue-fontawesome.ts diff --git a/frontend/src/components/misc/Icon.ts b/frontend/src/components/misc/Icon.ts deleted file mode 100644 index 8a5cab738..000000000 --- a/frontend/src/components/misc/Icon.ts +++ /dev/null @@ -1,206 +0,0 @@ -import {library} from '@fortawesome/fontawesome-svg-core' -import { - faAlignLeft, - faAngleRight, - faAnglesUp, - faArchive, - faArrowLeft, - faArrowDownShortWide, - faArrowUpFromBracket, - faArrowUpRightFromSquare, - faArrowUpShortWide, - faBold, - faItalic, - faStrikethrough, - faCode, - faBars, - faBell, - faBolt, - faCalendar, - faCheck, - faCheckDouble, - faChessKnight, - faChevronDown, - faCircleInfo, - faCloudDownloadAlt, - faCloudUploadAlt, - faCocktail, - faCoffee, - faCog, - faCopy, - faDownload, - faEllipsisH, - faEllipsisV, - faExclamation, - faExclamationCircle, - faEye, - faEyeSlash, - faFile, - faFileImage, - faFillDrip, - faFilter, - faForward, - faGripLines, - faHeader, - faHistory, - faImage, - faKeyboard, - faLayerGroup, - faList, - faListOl, - faLock, - faPaperclip, - faPaste, - faPen, - faPencilAlt, - faPercent, - faPlay, - faPlus, - faPowerOff, - faSearch, - faShareAlt, - faSignOutAlt, - faSitemap, - faSort, - faSortUp, - faStar as faStarSolid, - faStop, - faTachometerAlt, - faTags, - faTasks, - faTh, - faTimes, - faTrashAlt, - faUser, - faUsers, - faQuoteRight, - faListUl, - faLink, - faUndo, - faRedo, - faUnlink, - faParagraph, - faTable, - faX, faArrowTurnDown, faListCheck, faXmark, faXmarksLines, faFont, faRulerHorizontal, faUnderline, -} from '@fortawesome/free-solid-svg-icons' -import { - faBellSlash, - faCalendarAlt, - faCheckSquare, - faClock, - faComments, - faSave, - faSquareCheck, - faStar, - faSun, - faTimesCircle, - faCircleQuestion, faFaceLaugh, -} from '@fortawesome/free-regular-svg-icons' -import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome' - -import type {FontAwesomeIcon as FontAwesomeIconFixedTypes} from '@/types/vue-fontawesome' - -library.add(faBold) -library.add(faUndo) -library.add(faRedo) -library.add(faItalic) -library.add(faLink) -library.add(faUnlink) -library.add(faParagraph) -library.add(faSquareCheck) -library.add(faTable) -library.add(faFile) -library.add(faFileImage) -library.add(faCheckSquare) -library.add(faStrikethrough) -library.add(faCode) -library.add(faQuoteRight) -library.add(faListUl) -library.add(faAlignLeft) -library.add(faAngleRight) -library.add(faArchive) -library.add(faArrowLeft) -library.add(faBars) -library.add(faBell) -library.add(faBellSlash) -library.add(faCalendar) -library.add(faCalendarAlt) -library.add(faCheck) -library.add(faCheckDouble) -library.add(faChessKnight) -library.add(faChevronDown) -library.add(faCircleInfo) -library.add(faCircleQuestion) -library.add(faClock) -library.add(faCloudDownloadAlt) -library.add(faCloudUploadAlt) -library.add(faCocktail) -library.add(faCoffee) -library.add(faCog) -library.add(faComments) -library.add(faCopy) -library.add(faDownload) -library.add(faEllipsisH) -library.add(faEllipsisV) -library.add(faExclamationCircle) -library.add(faEye) -library.add(faEyeSlash) -library.add(faFillDrip) -library.add(faFilter) -library.add(faForward) -library.add(faGripLines) -library.add(faHeader) -library.add(faHistory) -library.add(faImage) -library.add(faKeyboard) -library.add(faLayerGroup) -library.add(faList) -library.add(faListOl) -library.add(faLock) -library.add(faPaperclip) -library.add(faPaste) -library.add(faPen) -library.add(faPencilAlt) -library.add(faPercent) -library.add(faPlay) -library.add(faPlus) -library.add(faPowerOff) -library.add(faSave) -library.add(faSearch) -library.add(faShareAlt) -library.add(faSignOutAlt) -library.add(faSitemap) -library.add(faSort) -library.add(faSortUp) -library.add(faStar) -library.add(faStarSolid) -library.add(faStop) -library.add(faSun) -library.add(faTachometerAlt) -library.add(faTags) -library.add(faTasks) -library.add(faTh) -library.add(faTimes) -library.add(faTimesCircle) -library.add(faTrashAlt) -library.add(faUser) -library.add(faUsers) -library.add(faArrowDownShortWide) -library.add(faArrowUpFromBracket) -library.add(faArrowUpShortWide) -library.add(faX) -library.add(faAnglesUp) -library.add(faBolt) -library.add(faArrowTurnDown) -library.add(faListCheck) -library.add(faXmark) -library.add(faXmarksLines) -library.add(faFont) -library.add(faRulerHorizontal) -library.add(faUnderline) -library.add(faFaceLaugh) -library.add(faExclamation) -library.add(faArrowUpRightFromSquare) - -// overwriting the wrong types -export default FontAwesomeIcon as unknown as FontAwesomeIconFixedTypes diff --git a/frontend/src/histoire.setup.ts b/frontend/src/histoire.setup.ts index 86a115fa6..713b82851 100644 --- a/frontend/src/histoire.setup.ts +++ b/frontend/src/histoire.setup.ts @@ -8,7 +8,6 @@ import {createPinia} from 'pinia' import testid from '@/directives/testid' -import FontAwesomeIcon from '@/components/misc/Icon' import XButton from '@/components/input/button.vue' import Modal from '@/components/misc/Modal.vue' import Card from '@/components/misc/Card.vue' @@ -21,7 +20,6 @@ export const setupVue3 = defineSetupVue3(({ app }) => { app.directive('cy', testid) - app.component('Icon', FontAwesomeIcon) app.component('XButton', XButton) app.component('Modal', Modal) app.component('Card', Card) diff --git a/frontend/src/main.ts b/frontend/src/main.ts index 0bf67c7e4..6a32f4f67 100644 --- a/frontend/src/main.ts +++ b/frontend/src/main.ts @@ -44,7 +44,6 @@ import shortcut from '@/directives/shortcut' import testid from '@/directives/testid' // global components -import FontAwesomeIcon from '@/components/misc/Icon' import Button from '@/components/input/Button.vue' import Modal from '@/components/misc/Modal.vue' import Card from '@/components/misc/Card.vue' @@ -62,7 +61,6 @@ setLanguage(browserLanguage).then(() => { app.directive('shortcut', shortcut) app.directive('cy', testid) - app.component('Icon', FontAwesomeIcon) app.component('XButton', Button) app.component('Modal', Modal) app.component('Card', Card) diff --git a/frontend/src/types/global-components.d.ts b/frontend/src/types/global-components.d.ts index cfc2d8727..2e30d1755 100644 --- a/frontend/src/types/global-components.d.ts +++ b/frontend/src/types/global-components.d.ts @@ -1,16 +1,11 @@ -import type { FunctionalComponent } from 'vue' -import type { Notifications } from '@kyvg/vue3-notification' -// import FontAwesomeIcon from '@/components/misc/Icon' -import type { FontAwesomeIcon as FontAwesomeIconFixedTypes } from './vue-fontawesome' +import type {FunctionalComponent} from 'vue' +import type {Notifications} from '@kyvg/vue3-notification' import type XButton from '@/components/input/Button.vue' import type Modal from '@/components/misc/Modal.vue' import type Card from '@/components/misc/Card.vue' -// Here we define globally imported components -// See: https://github.com/vuejs/language-tools/wiki/Global-Component-Types declare module 'vue' { export interface GlobalComponents { - Icon: FontAwesomeIconFixedTypes Notifications: FunctionalComponent XButton: typeof XButton, Modal: typeof Modal, diff --git a/frontend/src/types/vue-fontawesome.ts b/frontend/src/types/vue-fontawesome.ts deleted file mode 100644 index 1fdb56897..000000000 --- a/frontend/src/types/vue-fontawesome.ts +++ /dev/null @@ -1,40 +0,0 @@ -// copied and slightly modified from unmerged pull request that corrects types -// https://github.com/FortAwesome/vue-fontawesome/pull/355 - -import type { FaSymbol, FlipProp, IconLookup, IconProp, PullProp, SizeProp, Transform } from '@fortawesome/fontawesome-svg-core' -import type { DefineComponent } from 'vue' - - -interface FontAwesomeIconProps { - border?: boolean - fixedWidth?: boolean - flip?: FlipProp - icon: IconProp - mask?: IconLookup - listItem?: boolean - pull?: PullProp - pulse?: boolean - rotation?: 90 | 180 | 270 | '90' | '180' | '270' - swapOpacity?: boolean - size?: SizeProp - spin?: boolean - transform?: Transform - symbol?: FaSymbol - title?: string | string[] - inverse?: boolean -} - -interface FontAwesomeLayersProps { - fixedWidth?: boolean -} - -interface FontAwesomeLayersTextProps { - value: string | number - transform?: object | string - counter?: boolean - position?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right' -} - -export type FontAwesomeIcon = DefineComponent -export type FontAwesomeLayers = DefineComponent -export type FontAwesomeLayersText = DefineComponent