diff --git a/packages/pl-fe/src/components/__mocks__/react-inlinesvg.tsx b/packages/pl-fe/src/components/__mocks__/react-inlinesvg.tsx deleted file mode 100644 index f5eea5371..000000000 --- a/packages/pl-fe/src/components/__mocks__/react-inlinesvg.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; - -interface IInlineSVG { - loader?: JSX.Element; -} - -const InlineSVG: React.FC = ({ loader }): JSX.Element => { - if (loader) { - return loader; - } else { - throw 'You used react-inlinesvg without a loader! This will cause jumpy loading during render.'; - } -}; - -export { InlineSVG as default }; diff --git a/packages/pl-fe/src/components/ui/carousel.tsx b/packages/pl-fe/src/components/ui/carousel.tsx deleted file mode 100644 index cacdfa712..000000000 --- a/packages/pl-fe/src/components/ui/carousel.tsx +++ /dev/null @@ -1,112 +0,0 @@ -import React, { useEffect, useState } from 'react'; - -import { useDimensions } from 'pl-fe/hooks/useDimensions'; - -import HStack from './hstack'; -import Icon from './icon'; - -interface ICarousel { - children: any; - /** Optional height to force on controls */ - controlsHeight?: number; - /** How many items in the carousel */ - itemCount: number; - /** The minimum width per item */ - itemWidth: number; - /** Should the controls be disabled? */ - isDisabled?: boolean; -} - -/** - * Carousel - */ -const Carousel: React.FC = (props): JSX.Element => { - const { children, controlsHeight, isDisabled, itemCount, itemWidth } = props; - - // eslint-disable-next-line @typescript-eslint/no-unused-vars - const [ref, setContainerRef, { width: finalContainerWidth }] = useDimensions(); - const containerWidth = finalContainerWidth || ref?.clientWidth; - - const [pageSize, setPageSize] = useState(0); - const [currentPage, setCurrentPage] = useState(1); - - const numberOfPages = Math.ceil(itemCount / pageSize); - const width = containerWidth / (Math.floor(containerWidth / itemWidth)); - - const hasNextPage = currentPage < numberOfPages && numberOfPages > 1; - const hasPrevPage = currentPage > 1 && numberOfPages > 1; - - const handleNextPage = () => setCurrentPage((prevPage) => prevPage + 1); - const handlePrevPage = () => setCurrentPage((prevPage) => prevPage - 1); - - const renderChildren = () => { - if (typeof children === 'function') { - return children({ width: width || 'auto' }); - } - - return children; - }; - - useEffect(() => { - if (containerWidth) { - setPageSize(Math.round(containerWidth / width)); - } - }, [containerWidth, width]); - - return ( - -
- -
- -
- - {renderChildren()} - -
- -
- -
-
- ); -}; - -export { Carousel as default }; diff --git a/packages/pl-fe/src/components/ui/radio-button.tsx b/packages/pl-fe/src/components/ui/radio-button.tsx deleted file mode 100644 index d72cbc74e..000000000 --- a/packages/pl-fe/src/components/ui/radio-button.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React, { useMemo } from 'react'; - -import HStack from './hstack'; - -interface IRadioButton { - value: string; - checked?: boolean; - name: string; - onChange: React.ChangeEventHandler; - label: React.ReactNode; -} - -/** - * A group for radio input with label. - */ -const RadioButton: React.FC = ({ name, value, checked, onChange, label }) => { - const formFieldId: string = useMemo(() => `radio-${crypto.randomUUID()}`, []); - - return ( - - - - - - ); -}; - -export { RadioButton as default }; diff --git a/packages/pl-fe/src/entity-store/hooks/useChangeEntity.ts b/packages/pl-fe/src/entity-store/hooks/useChangeEntity.ts deleted file mode 100644 index 392e8c363..000000000 --- a/packages/pl-fe/src/entity-store/hooks/useChangeEntity.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { importEntities } from 'pl-fe/entity-store/actions'; -import { Entities } from 'pl-fe/entity-store/entities'; -import { useAppDispatch } from 'pl-fe/hooks/useAppDispatch'; -import { useGetState } from 'pl-fe/hooks/useGetState'; - -import type { Entity } from 'pl-fe/entity-store/types'; - -type ChangeEntityFn = (entity: TEntity) => TEntity - -const useChangeEntity = (entityType: Entities) => { - const getState = useGetState(); - const dispatch = useAppDispatch(); - - const changeEntity = (entityId: string, change: ChangeEntityFn): void => { - if (!entityId) return; - const entity = getState().entities[entityType]?.store[entityId] as TEntity | undefined; - if (entity) { - const newEntity = change(entity); - dispatch(importEntities([newEntity], entityType)); - } - }; - - return { changeEntity }; -}; - -export { useChangeEntity, type ChangeEntityFn }; diff --git a/packages/pl-fe/src/entity-store/hooks/useIncrementEntity.ts b/packages/pl-fe/src/entity-store/hooks/useIncrementEntity.ts deleted file mode 100644 index 080bbf7f9..000000000 --- a/packages/pl-fe/src/entity-store/hooks/useIncrementEntity.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { useAppDispatch } from 'pl-fe/hooks/useAppDispatch'; -import { useLoading } from 'pl-fe/hooks/useLoading'; - -import { incrementEntities } from '../actions'; - -import { parseEntitiesPath } from './utils'; - -import type { EntityFn, ExpandedEntitiesPath } from './types'; - -/** - * Increases (or decreases) the `totalCount` in the entity list by the specified amount. - * This only works if the API returns an `X-Total-Count` header and your components read it. - */ -const useIncrementEntity = ( - expandedPath: ExpandedEntitiesPath, - diff: number, - entityFn: EntityFn, -) => { - const dispatch = useAppDispatch(); - const [isLoading, setPromise] = useLoading(); - const { entityType, listKey } = parseEntitiesPath(expandedPath); - - const incrementEntity = async (entityId: string): Promise => { - dispatch(incrementEntities(entityType, listKey, diff)); - try { - await setPromise(entityFn(entityId)); - } catch (e) { - dispatch(incrementEntities(entityType, listKey, diff * -1)); - } - }; - - return { - incrementEntity, - isLoading, - }; -}; - -export { useIncrementEntity }; diff --git a/packages/pl-fe/src/features/ui/components/floating-action-button.tsx b/packages/pl-fe/src/features/ui/components/floating-action-button.tsx deleted file mode 100644 index 9cd3fe880..000000000 --- a/packages/pl-fe/src/features/ui/components/floating-action-button.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import clsx from 'clsx'; -import React from 'react'; -import { defineMessages, useIntl } from 'react-intl'; -import { useLocation, useRouteMatch } from 'react-router-dom'; - -import { groupComposeModal } from 'pl-fe/actions/compose'; -import { useGroup } from 'pl-fe/api/hooks/groups/useGroup'; -import Avatar from 'pl-fe/components/ui/avatar'; -import HStack from 'pl-fe/components/ui/hstack'; -import Icon from 'pl-fe/components/ui/icon'; -import { useAppDispatch } from 'pl-fe/hooks/useAppDispatch'; -import { useModalsStore } from 'pl-fe/stores/modals'; - -const messages = defineMessages({ - publish: { id: 'compose_form.publish', defaultMessage: 'Post' }, -}); - -/** FloatingActionButton (aka FAB), a composer button that floats in the corner on mobile. */ -const FloatingActionButton: React.FC = () => { - const location = useLocation(); - - if (location.pathname.startsWith('/group/')) { - return ; - } - - return ; -}; - -const HomeFAB: React.FC = () => { - const intl = useIntl(); - const { openModal } = useModalsStore(); - - const handleOpenComposeModal = () => { - openModal('COMPOSE'); - }; - - return ( - - ); -}; - -const GroupFAB: React.FC = () => { - const intl = useIntl(); - const dispatch = useAppDispatch(); - - const match = useRouteMatch<{ groupId: string }>('/groups/:groupId'); - const { group } = useGroup(match?.params.groupId || ''); - - if (!group) return null; - - const handleOpenComposeModal = () => { - dispatch(groupComposeModal(group)); - }; - - return ( - - ); -}; - -export { FloatingActionButton as default }; diff --git a/packages/pl-fe/src/normalizers/index.ts b/packages/pl-fe/src/normalizers/index.ts deleted file mode 100644 index de4024a75..000000000 --- a/packages/pl-fe/src/normalizers/index.ts +++ /dev/null @@ -1,9 +0,0 @@ -export { normalizeAccount, type Account } from './account'; -export { normalizeAdminReport, type AdminReport } from './admin-report'; -export { normalizeChatMessage, type ChatMessage } from './chat-message'; -export { normalizeGroup, type Group } from './group'; -export { normalizeGroupMember, type GroupMember } from './group-member'; -export { normalizeNotification, type Notification } from './notification'; -export { normalizeStatus, type Status } from './status'; - -export { PlFeConfigRecord, normalizePlFeConfig } from './pl-fe/pl-fe-config';