Remove unused files
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
86cb31918d
commit
60a7865420
7 changed files with 0 additions and 325 deletions
|
|
@ -1,15 +0,0 @@
|
||||||
import React from 'react';
|
|
||||||
|
|
||||||
interface IInlineSVG {
|
|
||||||
loader?: JSX.Element;
|
|
||||||
}
|
|
||||||
|
|
||||||
const InlineSVG: React.FC<IInlineSVG> = ({ 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 };
|
|
||||||
|
|
@ -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<ICarousel> = (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<number>(0);
|
|
||||||
const [currentPage, setCurrentPage] = useState<number>(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 (
|
|
||||||
<HStack alignItems='stretch'>
|
|
||||||
<div
|
|
||||||
className='z-10 flex w-5 items-center justify-center self-stretch rounded-l-xl bg-white dark:bg-primary-900'
|
|
||||||
style={{
|
|
||||||
height: controlsHeight || 'auto',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<button
|
|
||||||
data-testid='prev-page'
|
|
||||||
onClick={handlePrevPage}
|
|
||||||
className='flex h-full w-7 items-center justify-center transition-opacity duration-500 disabled:opacity-25'
|
|
||||||
disabled={!hasPrevPage || isDisabled}
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
src={require('@tabler/icons/outline/chevron-left.svg')}
|
|
||||||
className='size-5 text-black dark:text-white'
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className='relative w-full overflow-hidden'>
|
|
||||||
<HStack
|
|
||||||
alignItems='center'
|
|
||||||
style={{
|
|
||||||
transform: `translateX(-${(currentPage - 1) * 100}%)`,
|
|
||||||
}}
|
|
||||||
className='transition-all duration-500 ease-out'
|
|
||||||
ref={setContainerRef}
|
|
||||||
>
|
|
||||||
{renderChildren()}
|
|
||||||
</HStack>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
className='z-10 flex w-5 items-center justify-center self-stretch rounded-r-xl bg-white dark:bg-primary-900'
|
|
||||||
style={{
|
|
||||||
height: controlsHeight || 'auto',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<button
|
|
||||||
data-testid='next-page'
|
|
||||||
onClick={handleNextPage}
|
|
||||||
className='flex h-full w-7 items-center justify-center transition-opacity duration-500 disabled:opacity-25'
|
|
||||||
disabled={!hasNextPage || isDisabled}
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
src={require('@tabler/icons/outline/chevron-right.svg')}
|
|
||||||
className='size-5 text-black dark:text-white'
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</HStack>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export { Carousel as default };
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
import React, { useMemo } from 'react';
|
|
||||||
|
|
||||||
import HStack from './hstack';
|
|
||||||
|
|
||||||
interface IRadioButton {
|
|
||||||
value: string;
|
|
||||||
checked?: boolean;
|
|
||||||
name: string;
|
|
||||||
onChange: React.ChangeEventHandler<HTMLInputElement>;
|
|
||||||
label: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* A group for radio input with label.
|
|
||||||
*/
|
|
||||||
const RadioButton: React.FC<IRadioButton> = ({ name, value, checked, onChange, label }) => {
|
|
||||||
const formFieldId: string = useMemo(() => `radio-${crypto.randomUUID()}`, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<HStack alignItems='center' space={3}>
|
|
||||||
<input
|
|
||||||
type='radio'
|
|
||||||
name={name}
|
|
||||||
id={formFieldId}
|
|
||||||
value={value}
|
|
||||||
checked={checked}
|
|
||||||
onChange={onChange}
|
|
||||||
className='size-4 border-gray-300 text-primary-600 focus:ring-primary-500'
|
|
||||||
/>
|
|
||||||
|
|
||||||
<label htmlFor={formFieldId} className='block text-sm font-medium text-gray-700'>
|
|
||||||
{label}
|
|
||||||
</label>
|
|
||||||
</HStack>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export { RadioButton as default };
|
|
||||||
|
|
@ -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<TEntity extends Entity> = (entity: TEntity) => TEntity
|
|
||||||
|
|
||||||
const useChangeEntity = <TEntity extends Entity = Entity>(entityType: Entities) => {
|
|
||||||
const getState = useGetState();
|
|
||||||
const dispatch = useAppDispatch();
|
|
||||||
|
|
||||||
const changeEntity = (entityId: string, change: ChangeEntityFn<TEntity>): 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 };
|
|
||||||
|
|
@ -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<string>,
|
|
||||||
) => {
|
|
||||||
const dispatch = useAppDispatch();
|
|
||||||
const [isLoading, setPromise] = useLoading();
|
|
||||||
const { entityType, listKey } = parseEntitiesPath(expandedPath);
|
|
||||||
|
|
||||||
const incrementEntity = async (entityId: string): Promise<void> => {
|
|
||||||
dispatch(incrementEntities(entityType, listKey, diff));
|
|
||||||
try {
|
|
||||||
await setPromise(entityFn(entityId));
|
|
||||||
} catch (e) {
|
|
||||||
dispatch(incrementEntities(entityType, listKey, diff * -1));
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return {
|
|
||||||
incrementEntity,
|
|
||||||
isLoading,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
export { useIncrementEntity };
|
|
||||||
|
|
@ -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 <GroupFAB />;
|
|
||||||
}
|
|
||||||
|
|
||||||
return <HomeFAB />;
|
|
||||||
};
|
|
||||||
|
|
||||||
const HomeFAB: React.FC = () => {
|
|
||||||
const intl = useIntl();
|
|
||||||
const { openModal } = useModalsStore();
|
|
||||||
|
|
||||||
const handleOpenComposeModal = () => {
|
|
||||||
openModal('COMPOSE');
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
onClick={handleOpenComposeModal}
|
|
||||||
className={clsx(
|
|
||||||
'inline-flex appearance-none items-center rounded-full border p-4 font-medium transition-all focus:outline-none focus:ring-2 focus:ring-offset-2',
|
|
||||||
'border-transparent bg-secondary-500 text-gray-100 hover:bg-secondary-400 focus:bg-secondary-500 focus:ring-secondary-300',
|
|
||||||
)}
|
|
||||||
aria-label={intl.formatMessage(messages.publish)}
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
src={require('@tabler/icons/outline/pencil-plus.svg')}
|
|
||||||
className='size-6'
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
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 (
|
|
||||||
<button
|
|
||||||
onClick={handleOpenComposeModal}
|
|
||||||
className={clsx(
|
|
||||||
'inline-flex appearance-none items-center rounded-full border p-4 font-medium transition-all focus:outline-none focus:ring-2 focus:ring-offset-2',
|
|
||||||
'border-transparent bg-secondary-500 text-gray-100 hover:bg-secondary-400 focus:bg-secondary-500 focus:ring-secondary-300',
|
|
||||||
)}
|
|
||||||
aria-label={intl.formatMessage(messages.publish)}
|
|
||||||
>
|
|
||||||
<HStack space={3} alignItems='center'>
|
|
||||||
<Avatar className='-my-3 -ml-2 border-white' size={42} src={group.avatar} alt={group.avatar_description} />
|
|
||||||
<Icon
|
|
||||||
src={require('@tabler/icons/outline/pencil-plus.svg')}
|
|
||||||
className='size-6'
|
|
||||||
/>
|
|
||||||
</HStack>
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export { FloatingActionButton as default };
|
|
||||||
|
|
@ -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';
|
|
||||||
Loading…
Reference in a new issue