Sort components (#163)

* Move common components to the `common` directory
* rename style directory
* Move ForkAwesome to common
* Move initializers and restructure application-loader.tsx

src/components/application-loader/application-loader.tsx

@@ -1,33 +1,29 @@
-import React, { Fragment, useEffect, useState } from 'react'
+import React, { Fragment, useCallback, useEffect, useState } from 'react'
 import { useLocation } from 'react-router'
-import { InitTask, setUp } from '../../initializers'
 import './application-loader.scss'
+import { createSetUpTaskList, InitTask } from './initializers'
 
 import { LoadingScreen } from './loading-screen'
 
 export const ApplicationLoader: React.FC = ({ children }) => {
+  const { pathname } = useLocation()
+
+  const setUpTasks = useCallback(() => {
+    const baseUrl: string = window.location.pathname.replace(pathname, '') + '/'
+    console.debug('Base URL is', baseUrl)
+    return createSetUpTaskList(baseUrl)
+  }, [pathname])
+
   const [failedTitle, setFailedTitle] = useState<string>('')
   const [doneTasks, setDoneTasks] = useState<number>(0)
-  const [initTasks, setInitTasks] = useState<InitTask[]>([])
-  const { pathname } = useLocation()
-  const [tasksAlreadyTriggered, setTasksAlreadyTriggered] = useState<boolean>(false)
+  const [initTasks] = useState<InitTask[]>(setUpTasks)
 
-  const runTask = async (task: Promise<void>): Promise<void> => {
+  const runTask = useCallback(async (task: Promise<void>): Promise<void> => {
     await task
     setDoneTasks(prevDoneTasks => {
       return prevDoneTasks + 1
     })
-  }
-
-  useEffect(() => {
-    if (tasksAlreadyTriggered) {
-      return
-    }
-    setTasksAlreadyTriggered(true)
-    const baseUrl: string = window.location.pathname.replace(pathname, '') + '/'
-    console.debug('Base URL is', baseUrl)
-    setInitTasks(setUp(baseUrl))
-  }, [tasksAlreadyTriggered, pathname])
+  }, [])
 
   useEffect(() => {
     for (const task of initTasks) {
@@ -36,7 +32,7 @@ export const ApplicationLoader: React.FC = ({ children }) => {
         setFailedTitle(task.name)
       })
     }
-  }, [initTasks])
+  }, [initTasks, runTask])
 
   return (
     doneTasks < initTasks.length || initTasks.length === 0

src/components/application-loader/initializers/configLoader.ts

@@ -1,8 +1,8 @@
-import { getBackendConfig } from '../api/backend-config'
-import { getFrontendConfig } from '../api/frontend-config'
-import { setBackendConfig } from '../redux/backend-config/methods'
-import { setFrontendConfig } from '../redux/frontend-config/methods'
-import { getAndSetUser } from '../utils/apiUtils'
+import { getBackendConfig } from '../../../api/backend-config'
+import { getFrontendConfig } from '../../../api/frontend-config'
+import { setBackendConfig } from '../../../redux/backend-config/methods'
+import { setFrontendConfig } from '../../../redux/frontend-config/methods'
+import { getAndSetUser } from '../../../utils/apiUtils'
 
 export const loadAllConfig: (baseUrl: string) => Promise<void> = async (baseUrl) => {
   const frontendConfig = await getFrontendConfig(baseUrl)

src/components/application-loader/initializers/i18n.ts

@@ -1,7 +1,6 @@
 import i18n from 'i18next'
-import Backend from 'i18next-http-backend'
 import LanguageDetector from 'i18next-browser-languagedetector'
-import { initReactI18next } from 'react-i18next'
+import Backend from 'i18next-http-backend'
 import moment from 'moment'
 import 'moment/locale/ar'
 import 'moment/locale/ca'
@@ -30,6 +29,7 @@ import 'moment/locale/uk'
 import 'moment/locale/vi'
 import 'moment/locale/zh-cn'
 import 'moment/locale/zh-tw'
+import { initReactI18next } from 'react-i18next'
 
 export const setUpI18n = async (): Promise<void> => {
   await i18n

src/components/application-loader/initializers/index.ts

@@ -14,7 +14,7 @@ export interface InitTask {
   task: Promise<void>
 }
 
-export const setUp = (baseUrl: string): InitTask[] => {
+export const createSetUpTaskList = (baseUrl: string): InitTask[] => {
   return [{
     name: 'Load Translations',
     task: setUpI18n()

src/components/application-loader/loading-screen.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Alert } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../fork-awesome/fork-awesome-icon'
-import { ShowIf } from '../common/show-if'
+import { ForkAwesomeIcon } from '../common/fork-awesome/fork-awesome-icon'
+import { ShowIf } from '../common/show-if/show-if'
 
 export interface LoadingScreenProps {
   failedTitle: string

src/components/common/element-separator/element-separator.tsx

@@ -1,5 +1,5 @@
 import React, { Fragment } from 'react'
-import { ShowIf } from '../common/show-if'
+import { ShowIf } from '../show-if/show-if'
 
 export interface ElementSeparatorProps {
     separator: React.ReactElement

src/components/common/error-modal/error-modal.tsx

@@ -1,7 +1,7 @@
 import React, { Fragment } from 'react'
 import { Modal } from 'react-bootstrap'
 import { Trans } from 'react-i18next'
-import { ForkAwesomeIcon, IconName } from '../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon, IconName } from '../fork-awesome/fork-awesome-icon'
 
 export interface ErrorModalProps {
   show: boolean

src/components/common/icon-button/icon-button.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
-import './icon-button.scss'
 import { Button, ButtonProps } from 'react-bootstrap'
-import { ForkAwesomeIcon, IconName } from '../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon, IconName } from '../fork-awesome/fork-awesome-icon'
+import './icon-button.scss'
 
 export interface SocialButtonProps extends ButtonProps {
   icon: IconName

src/components/common/links/external-link.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
-import { ForkAwesomeIcon, IconName } from '../../fork-awesome/fork-awesome-icon'
-import { ShowIf } from '../common/show-if'
+import { ForkAwesomeIcon, IconName } from '../fork-awesome/fork-awesome-icon'
+import { ShowIf } from '../show-if/show-if'
 import { LinkWithTextProps } from './types'
 
 export const ExternalLink: React.FC<LinkWithTextProps> = ({ href, text, icon, className = 'text-light' }) => {

src/components/common/links/internal-link.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
-import { ForkAwesomeIcon, IconName } from '../../fork-awesome/fork-awesome-icon'
-import { ShowIf } from '../common/show-if'
+import { ForkAwesomeIcon, IconName } from '../fork-awesome/fork-awesome-icon'
+import { ShowIf } from '../show-if/show-if'
 import { LinkWithTextProps } from './types'
 
 export const InternalLink: React.FC<LinkWithTextProps> = ({ href, text, icon, className = 'text-light' }) => {

src/components/common/links/types.ts

@@ -1,5 +1,5 @@
 import { StringMap, TOptionsBase } from 'i18next'
-import { IconName } from '../../fork-awesome/fork-awesome-icon'
+import { IconName } from '../fork-awesome/fork-awesome-icon'
 
 export interface GeneralLinkProp {
   href: string;

src/components/common/pagination/pager-pagination.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react'
 import { Pagination } from 'react-bootstrap'
-import { ShowIf } from '../common/show-if'
+import { ShowIf } from '../show-if/show-if'
 import { PagerItem } from './pager-item'
 
 export interface PaginationProps {

src/components/common/sort-button/sort-button.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { ButtonProps } from 'react-bootstrap'
-import { IconName } from '../../fork-awesome/fork-awesome-icon'
+import { IconName } from '../fork-awesome/fork-awesome-icon'
 import { IconButton } from '../icon-button/icon-button'
 
 export enum SortModeEnum {

src/components/editor/editor.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { useSelector } from 'react-redux'
 import { useParams } from 'react-router'
 import { ApplicationState } from '../../redux'
-import { ShowIf } from '../common/show-if'
+import { ShowIf } from '../common/show-if/show-if'
 import { EditorWindow } from './editor-window/editor-window'
 import { MarkdownPreview } from './markdown-preview/markdown-preview'
 import { EditorMode } from './task-bar/editor-view-mode'

src/components/editor/task-bar/connection-indicator.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Dropdown } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
 import { ActiveIndicatorStatus } from './active-indicator'
 import './connection-indicator.scss'
 import { UserLine } from './user-line'

src/components/editor/task-bar/dark-mode-button.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import { ToggleButton, ToggleButtonGroup } from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
 
 const DarkModeButton: React.FC = () => {
   const { t } = useTranslation()

src/components/editor/task-bar/editor-menu.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Dropdown } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
 
 const EditorMenu: React.FC = () => {
   useTranslation()

src/components/editor/task-bar/editor-view-mode.tsx

@@ -2,9 +2,9 @@ import React from 'react'
 import { ToggleButton, ToggleButtonGroup } from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
 import { ApplicationState } from '../../../redux'
 import { setEditorModeConfig } from '../../../redux/editor/methods'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
 
 export enum EditorMode {
   PREVIEW,

src/components/editor/task-bar/help-button.tsx

@@ -1,8 +1,8 @@
 import React, { Fragment, useState } from 'react'
 import { Button, Card, Col, Modal, Row, Table } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
-import { TranslatedExternalLink } from '../../links/translated-external-link'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
+import { TranslatedExternalLink } from '../../common/links/translated-external-link'
 
 export const HelpButton: React.FC = () => {
   const { t } = useTranslation()

src/components/editor/task-bar/task-bar.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
-import { Link } from 'react-router-dom'
 import { Button, Nav, Navbar } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../fork-awesome/fork-awesome-icon'
-import { DarkModeButton } from './dark-mode-button'
-import { EditorViewMode } from './editor-view-mode'
 import { Trans, useTranslation } from 'react-i18next'
-import { EditorMenu } from './editor-menu'
+import { Link } from 'react-router-dom'
+import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
 import { ConnectionIndicator } from './connection-indicator'
+import { DarkModeButton } from './dark-mode-button'
+import { EditorMenu } from './editor-menu'
+import { EditorViewMode } from './editor-view-mode'
 import { HelpButton } from './help-button'
 
 const TaskBar: React.FC = () => {

src/components/landing/layout/footer/powered-by-links.tsx

@@ -2,9 +2,9 @@ import React, { Fragment } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { ApplicationState } from '../../../../redux'
-import { ExternalLink } from '../../../links/external-link'
-import { TranslatedExternalLink } from '../../../links/translated-external-link'
-import { TranslatedInternalLink } from '../../../links/translated-internal-link'
+import { ExternalLink } from '../../../common/links/external-link'
+import { TranslatedExternalLink } from '../../../common/links/translated-external-link'
+import { TranslatedInternalLink } from '../../../common/links/translated-internal-link'
 import { VersionInfo } from '../version-info/version-info'
 
 export const PoweredByLinks: React.FC = () => {

src/components/landing/layout/footer/social-links.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Trans, useTranslation } from 'react-i18next'
-import { ExternalLink } from '../../../links/external-link'
+import { ExternalLink } from '../../../common/links/external-link'
 
 const SocialLink: React.FC = () => {
   useTranslation()

src/components/landing/layout/navigation/new-guest-note-button.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
-import { LinkContainer } from 'react-router-bootstrap'
 import { Button } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../fork-awesome/fork-awesome-icon'
+import { LinkContainer } from 'react-router-bootstrap'
+import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
 
 export const NewGuestNoteButton: React.FC = () => {
   const { t } = useTranslation()

src/components/landing/layout/navigation/new-user-note-button.tsx

@@ -1,8 +1,8 @@
-import { LinkContainer } from 'react-router-bootstrap'
-import { Button } from 'react-bootstrap'
 import React from 'react'
+import { Button } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../fork-awesome/fork-awesome-icon'
+import { LinkContainer } from 'react-router-bootstrap'
+import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
 
 export const NewUserNoteButton: React.FC = () => {
   const { t } = useTranslation()

src/components/landing/layout/navigation/sign-in-button.tsx

@@ -5,7 +5,7 @@ import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { LinkContainer } from 'react-router-bootstrap'
 import { ApplicationState } from '../../../../redux'
-import { ShowIf } from '../../../common/show-if'
+import { ShowIf } from '../../../common/show-if/show-if'
 
 type SignInButtonProps = {
   className?: string

src/components/landing/layout/navigation/user-dropdown/user-dropdown.tsx

@@ -3,9 +3,9 @@ import { Dropdown } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { LinkContainer } from 'react-router-bootstrap'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
 import { ApplicationState } from '../../../../../redux'
 import { clearUser } from '../../../../../redux/user/methods'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 import { UserAvatar } from '../../user-avatar/user-avatar'
 
 export const UserDropdown: React.FC = () => {

src/components/landing/layout/version-info/version-info.tsx

@@ -5,8 +5,8 @@ import { useSelector } from 'react-redux'
 import { Link } from 'react-router-dom'
 import { ApplicationState } from '../../../../redux'
 import frontendVersion from '../../../../version.json'
-import { ShowIf } from '../../../common/show-if'
-import { TranslatedExternalLink } from '../../../links/translated-external-link'
+import { TranslatedExternalLink } from '../../../common/links/translated-external-link'
+import { ShowIf } from '../../../common/show-if/show-if'
 import { VersionInputField } from './version-input-field'
 
 export const VersionInfo: React.FC = () => {

src/components/landing/layout/version-info/version-input-field.tsx

@@ -1,7 +1,7 @@
 import React, { Fragment, useRef, useState } from 'react'
 import { Button, FormControl, InputGroup, Overlay, Tooltip } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
 
 export interface VersionInputFieldProps {
   version: string

src/components/landing/pages/history/common/close-button.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Button } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 import './close-button.scss'
 
 export interface CloseButtonProps {

src/components/landing/pages/history/common/pin-button.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Button } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 import './pin-button.scss'
 
 export interface PinButtonProps {

src/components/landing/pages/history/common/sync-status.tsx

@@ -1,18 +1,18 @@
 import React from 'react'
 import { Button } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
-import { Location } from '../history'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
+import { HistoryEntryOrigin } from '../history'
 import './sync-status.scss'
 
 export interface SyncStatusProps {
   isDark: boolean
-  location: Location
+  location: HistoryEntryOrigin
   onSync: () => void
   className?: string
 }
 
 export const SyncStatus: React.FC<SyncStatusProps> = ({ isDark, location, onSync, className }) => {
-  const icon = location === Location.REMOTE ? 'cloud' : 'laptop'
+  const icon = location === HistoryEntryOrigin.REMOTE ? 'cloud' : 'laptop'
   return (
     <Button variant={isDark ? 'secondary' : 'light'} onClick={onSync} className={`sync-icon ${className || ''}`}>
       <ForkAwesomeIcon icon={icon}/>

src/components/landing/pages/history/history-card/history-card-list.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Row } from 'react-bootstrap'
-import { Pager } from '../../../../pagination/pager'
+import { Pager } from '../../../../common/pagination/pager'
 import { HistoryEntriesProps } from '../history-content/history-content'
 import { HistoryCard } from './history-card'
 

src/components/landing/pages/history/history-card/history-card.tsx

@@ -1,8 +1,8 @@
 import moment from 'moment'
 import React from 'react'
 import { Badge, Card } from 'react-bootstrap'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
 import { formatHistoryDate } from '../../../../../utils/historyUtils'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 import { CloseButton } from '../common/close-button'
 import { PinButton } from '../common/pin-button'
 import { SyncStatus } from '../common/sync-status'

src/components/landing/pages/history/history-content/history-content.tsx

@@ -1,8 +1,8 @@
 import React, { Fragment, useState } from 'react'
 import { Alert, Row } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { PagerPagination } from '../../../../pagination/pager-pagination'
 import { LocatedHistoryEntry } from '../history'
+import { PagerPagination } from '../../../../common/pagination/pager-pagination'
 import { HistoryCardList } from '../history-card/history-card-list'
 import { HistoryTable } from '../history-table/history-table'
 import { ViewStateEnum } from '../history-toolbar/history-toolbar'

src/components/landing/pages/history/history-table/history-table.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Table } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { Pager } from '../../../../pagination/pager'
+import { Pager } from '../../../../common/pagination/pager'
 import { HistoryEntriesProps } from '../history-content/history-content'
 import { HistoryTableRow } from './history-table-row'
 import './history-table.scss'

src/components/landing/pages/history/history-toolbar/clear-history-button.tsx

@@ -1,7 +1,7 @@
-import React, { useState, Fragment } from 'react'
+import React, { Fragment, useState } from 'react'
 import { Button, Modal } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 
 export interface ClearHistoryButtonProps {
   onClearHistory: () => void

src/components/landing/pages/history/history-toolbar/export-history-button.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Button } from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 
 export interface ExportHistoryButtonProps {
   onExportHistory: () => void

src/components/landing/pages/history/history-toolbar/history-toolbar.tsx

@@ -2,8 +2,8 @@ import React, { ChangeEvent, useEffect, useState } from 'react'
 import { Button, Form, FormControl, InputGroup, ToggleButton, ToggleButtonGroup } from 'react-bootstrap'
 import { Typeahead } from 'react-bootstrap-typeahead'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
-import { SortButton, SortModeEnum } from '../../../../sort-button/sort-button'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
+import { SortButton, SortModeEnum } from '../../../../common/sort-button/sort-button'
 import { HistoryEntry } from '../history'
 import { ClearHistoryButton } from './clear-history-button'
 import { ExportHistoryButton } from './export-history-button'

src/components/landing/pages/history/history-toolbar/import-history-button.tsx

@@ -1,9 +1,9 @@
 import React, { useRef, useState } from 'react'
 import { Button } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
 import { convertV1History, V1HistoryEntry } from '../../../../../utils/historyUtils'
-import { ErrorModal } from '../../../../error-modal/error-modal'
+import { ErrorModal } from '../../../../common/error-modal/error-modal'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 import { HistoryEntry, HistoryJson } from '../history'
 
 export interface ImportHistoryButtonProps {

src/components/landing/pages/history/history.tsx

@@ -12,7 +12,7 @@ import {
   setHistoryToLocalStore,
   sortAndFilterEntries
 } from '../../../../utils/historyUtils'
-import { ErrorModal } from '../../../error-modal/error-modal'
+import { ErrorModal } from '../../../common/error-modal/error-modal'
 import { HistoryContent } from './history-content/history-content'
 import { HistoryToolbar, HistoryToolbarState, initState as toolbarInitState } from './history-toolbar/history-toolbar'
 
@@ -32,10 +32,10 @@ export interface HistoryJson {
 export type LocatedHistoryEntry = HistoryEntry & HistoryEntryLocation
 
 export interface HistoryEntryLocation {
-  location: Location
+  location: HistoryEntryOrigin
 }
 
-export enum Location {
+export enum HistoryEntryOrigin {
   LOCAL = 'local',
   REMOTE = 'remote'
 }

src/components/landing/pages/intro/cover-buttons/cover-buttons.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { Link } from 'react-router-dom'
 import { ApplicationState } from '../../../../../redux'
-import { ShowIf } from '../../../../common/show-if'
+import { ShowIf } from '../../../../common/show-if/show-if'
 import { SignInButton } from '../../../layout/navigation/sign-in-button'
 import './cover-buttons.scss'
 

src/components/landing/pages/intro/feature-links.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
-import { Link } from 'react-router-dom'
 import { Col, Row } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { ForkAwesomeIcon } from '../../../../fork-awesome/fork-awesome-icon'
+import { Link } from 'react-router-dom'
+import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
 
 export const FeatureLinks: React.FC = () => {
   useTranslation()

src/components/landing/pages/intro/intro.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
-import { ForkAwesomeIcon } from '../../../../fork-awesome/fork-awesome-icon'
-import screenshot from './img/screenshot.png'
 import { Trans, useTranslation } from 'react-i18next'
-import { FeatureLinks } from './feature-links'
+import { ForkAwesomeIcon } from '../../../common/fork-awesome/fork-awesome-icon'
 import { CoverButtons } from './cover-buttons/cover-buttons'
+import { FeatureLinks } from './feature-links'
+import screenshot from './img/screenshot.png'
 
 const Intro: React.FC = () => {
   const { t } = useTranslation()

src/components/landing/pages/login/auth/social-link-button/social-link-button.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
+import { ForkAwesomeIcon, IconName } from '../../../../../common/fork-awesome/fork-awesome-icon'
 import './social-link-button.scss'
-import { ForkAwesomeIcon, IconName } from '../../../../../../fork-awesome/fork-awesome-icon'
 
 export interface SocialButtonProps {
   backgroundClass: string,

src/components/landing/pages/login/auth/via-one-click.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { IconName } from '../../../../../fork-awesome/fork-awesome-icon'
+import { IconName } from '../../../../common/fork-awesome/fork-awesome-icon'
 import { SocialLinkButton } from './social-link-button/social-link-button'
 
 export enum OneClickType {

src/components/landing/pages/login/login.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { Redirect } from 'react-router'
 import { ApplicationState } from '../../../../redux'
-import { ShowIf } from '../../../common/show-if'
+import { ShowIf } from '../../../common/show-if/show-if'
 import { ViaEMail } from './auth/via-email'
 import { ViaLdap } from './auth/via-ldap'
 import { OneClickType, ViaOneClick } from './auth/via-one-click'

src/components/landing/pages/profile/profile.tsx

@@ -4,7 +4,7 @@ import { useSelector } from 'react-redux'
 import { Redirect } from 'react-router'
 import { ApplicationState } from '../../../../redux'
 import { LoginProvider } from '../../../../redux/user/types'
-import { ShowIf } from '../../../common/show-if'
+import { ShowIf } from '../../../common/show-if/show-if'
 import { ProfileAccountManagement } from './settings/profile-account-management'
 import { ProfileChangePassword } from './settings/profile-change-password'
 import { ProfileDisplayName } from './settings/profile-display-name'

src/components/landing/pages/profile/settings/profile-account-management.tsx

@@ -2,9 +2,9 @@ import React, { Fragment, useEffect, useRef, useState } from 'react'
 import { Button, Card, Modal } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
 import { deleteUser } from '../../../../../api/me'
-import { ForkAwesomeIcon } from '../../../../../fork-awesome/fork-awesome-icon'
 import { clearUser } from '../../../../../redux/user/methods'
 import { getBackendUrl } from '../../../../../utils/apiUtils'
+import { ForkAwesomeIcon } from '../../../../common/fork-awesome/fork-awesome-icon'
 
 export const ProfileAccountManagement: React.FC = () => {
   useTranslation()