bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

pl-fe: Remove mutes reducer

Browse source 
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2024-11-09 12:14:37 +01:00
parent d4e6f9f4cc
commit e50446dfb2
9 changed files with 25 additions and 170 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
packages/pl-fe/src/actions/mutes.ts
View file

@ -1,40 +0,0 @@
import { useModalsStore } from 'pl-fe/stores/modals';
import type { Account } from 'pl-fe/normalizers/account';
import type { AppDispatch } from 'pl-fe/store';
const MUTES_INIT_MODAL = 'MUTES_INIT_MODAL';
const MUTES_TOGGLE_HIDE_NOTIFICATIONS = 'MUTES_TOGGLE_HIDE_NOTIFICATIONS';
const MUTES_CHANGE_DURATION = 'MUTES_CHANGE_DURATION';
const initMuteModal = (account: Account) =>
(dispatch: AppDispatch) => {
dispatch({
type: MUTES_INIT_MODAL,
account,
});
useModalsStore.getState().openModal('MUTE');
};
const toggleHideNotifications = () =>
(dispatch: AppDispatch) => {
dispatch({ type: MUTES_TOGGLE_HIDE_NOTIFICATIONS });
};
const changeMuteDuration = (duration: number) =>
(dispatch: AppDispatch) => {
dispatch({
type: MUTES_CHANGE_DURATION,
duration,
});
};
export {
MUTES_INIT_MODAL,
MUTES_TOGGLE_HIDE_NOTIFICATIONS,
MUTES_CHANGE_DURATION,
initMuteModal,
toggleHideNotifications,
changeMuteDuration,
};

3
packages/pl-fe/src/components/status-action-bar.tsx
View file

@ -9,7 +9,6 @@ import { directCompose, mentionCompose, quoteCompose, replyCompose } from 'pl-fe
import { emojiReact, unEmojiReact } from 'pl-fe/actions/emoji-reacts';
import { toggleBookmark, toggleDislike, toggleFavourite, togglePin, toggleReblog } from 'pl-fe/actions/interactions';
import { deleteStatusModal, toggleStatusSensitivityModal } from 'pl-fe/actions/moderation';
import { initMuteModal } from 'pl-fe/actions/mutes';
import { initReport, ReportableEntities } from 'pl-fe/actions/reports';
import { changeSetting } from 'pl-fe/actions/settings';
import { deleteStatus, editStatus, toggleMuteStatus, translateStatus, undoStatusTranslation } from 'pl-fe/actions/statuses';
@ -681,7 +680,7 @@ const MenuButton: React.FC<IMenuButton> = ({
};
const handleMuteClick: React.EventHandler<React.MouseEvent> = (e) => {
dispatch(initMuteModal(status.account));
openModal('MUTE', { accountId: status.account.id });
};
const handleBlockClick: React.EventHandler<React.MouseEvent> = (e) => {

3
packages/pl-fe/src/features/account/components/header.tsx
View file

@ -8,7 +8,6 @@ import * as v from 'valibot';
import { biteAccount, blockAccount, pinAccount, removeFromFollowers, unblockAccount, unmuteAccount, unpinAccount } from 'pl-fe/actions/accounts';
import { mentionCompose, directCompose } from 'pl-fe/actions/compose';
import { blockDomain, unblockDomain } from 'pl-fe/actions/domain-blocks';
import { initMuteModal } from 'pl-fe/actions/mutes';
import { initReport, ReportableEntities } from 'pl-fe/actions/reports';
import { setSearchAccount } from 'pl-fe/actions/search';
import { useFollow } from 'pl-fe/api/hooks/accounts/use-follow';
@ -196,7 +195,7 @@ const Header: React.FC<IHeader> = ({ account }) => {
if (account.relationship?.muting) {
dispatch(unmuteAccount(account.id));
} else {
dispatch(initMuteModal(account));
openModal('MUTE', { accountId: account.id });
}
};

3
packages/pl-fe/src/features/event/components/event-header.tsx
View file

@ -7,7 +7,6 @@ import { directCompose, mentionCompose, quoteCompose } from 'pl-fe/actions/compo
import { fetchEventIcs } from 'pl-fe/actions/events';
import { toggleBookmark, togglePin, toggleReblog } from 'pl-fe/actions/interactions';
import { deleteStatusModal, toggleStatusSensitivityModal } from 'pl-fe/actions/moderation';
import { initMuteModal } from 'pl-fe/actions/mutes';
import { initReport, ReportableEntities } from 'pl-fe/actions/reports';
import { deleteStatus } from 'pl-fe/actions/statuses';
import DropdownMenu, { type Menu as MenuType } from 'pl-fe/components/dropdown-menu';
@ -167,7 +166,7 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
};
const handleMuteClick = () => {
dispatch(initMuteModal(account));
openModal('MUTE', { accountId: account.id });
};
const handleBlockClick = () => {

32
packages/pl-fe/src/features/ui/components/modals/mute-modal.tsx
View file

@ -1,8 +1,7 @@
import React from 'react';
import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { muteAccount } from 'pl-fe/actions/accounts';
import { toggleHideNotifications, changeMuteDuration } from 'pl-fe/actions/mutes';
import { useAccount } from 'pl-fe/api/hooks/accounts/use-account';
import HStack from 'pl-fe/components/ui/hstack';
import Modal from 'pl-fe/components/ui/modal';
@ -11,25 +10,31 @@ import Text from 'pl-fe/components/ui/text';
import Toggle from 'pl-fe/components/ui/toggle';
import DurationSelector from 'pl-fe/features/compose/components/polls/duration-selector';
import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
import { useAppSelector } from 'pl-fe/hooks/use-app-selector';
import { useFeatures } from 'pl-fe/hooks/use-features';
import type { BaseModalProps } from '../modal-root';
const MuteModal: React.FC<BaseModalProps> = ({ onClose }) => {
interface MuteModalProps {
accountId: string;
}
const MuteModal: React.FC<MuteModalProps & BaseModalProps> = ({ accountId, onClose }) => {
const dispatch = useAppDispatch();
const accountId = useAppSelector((state) => state.mutes.new.accountId);
const { account } = useAccount(accountId || undefined);
const notifications = useAppSelector((state) => state.mutes.new.notifications);
const duration = useAppSelector((state) => state.mutes.new.duration);
const [notifications, setNotifications] = useState(true);
const [duration, setDuration] = useState(0);
const [isSubmitting, setIsSubmitting] = useState(false);
const mutesDuration = useFeatures().mutesDuration;
if (!account) return null;
const handleClick = () => {
onClose('MUTE');
dispatch(muteAccount(account.id, notifications, duration));
setIsSubmitting(true);
dispatch(muteAccount(account.id, notifications, duration))?.then(() => {
setIsSubmitting(false);
onClose('MUTE');
});
};
const handleCancel = () => {
@ -37,14 +42,14 @@ const MuteModal: React.FC<BaseModalProps> = ({ onClose }) => {
};
const toggleNotifications = () => {
dispatch(toggleHideNotifications());
setNotifications(notifications => !notifications);
};
const handleChangeMuteDuration = (expiresIn: number): void => {
dispatch(changeMuteDuration(expiresIn));
setDuration(expiresIn);
};
const toggleAutoExpire = () => handleChangeMuteDuration(duration ? 0 : 2 * 60 * 60 * 24);
const toggleAutoExpire = () => setDuration(duration ? 0 : 2 * 60 * 60 * 24);
return (
<Modal
@ -58,6 +63,7 @@ const MuteModal: React.FC<BaseModalProps> = ({ onClose }) => {
onClose={handleCancel}
confirmationAction={handleClick}
confirmationText={<FormattedMessage id='confirmations.mute.confirm' defaultMessage='Mute' />}
confirmationDisabled={isSubmitting}
cancelText={<FormattedMessage id='confirmation_modal.cancel' defaultMessage='Cancel' />}
cancelAction={handleCancel}
>
@ -112,4 +118,4 @@ const MuteModal: React.FC<BaseModalProps> = ({ onClose }) => {
);
};
export { MuteModal as default };
export { MuteModal as default, type MuteModalProps };

2
packages/pl-fe/src/reducers/index.ts
View file

@ -26,7 +26,6 @@ import lists from './lists';
import locations from './locations';
import me from './me';
import meta from './meta';
import mutes from './mutes';
import notifications from './notifications';
import onboarding from './onboarding';
import pending_statuses from './pending-statuses';
@ -69,7 +68,6 @@ const reducers = {
locations,
me,
meta,
mutes,
notifications,
onboarding,
pending_statuses,

67
packages/pl-fe/src/reducers/mutes.test.ts
View file

@ -1,67 +0,0 @@
import { Record as ImmutableRecord } from 'immutable';
import {
MUTES_INIT_MODAL,
MUTES_TOGGLE_HIDE_NOTIFICATIONS,
} from 'pl-fe/actions/mutes';
import reducer from './mutes';
describe('mutes reducer', () => {
it('should return the initial state', () => {
expect(reducer(undefined, {} as any).toJS()).toEqual({
new: {
isSubmitting: false,
accountId: null,
notifications: true,
duration: 0,
},
});
});
it('should handle MUTES_INIT_MODAL', () => {
const state = ImmutableRecord({
new: ImmutableRecord({
isSubmitting: false,
accountId: null,
notifications: true,
duration: 0,
})(),
})();
const action = {
type: MUTES_INIT_MODAL,
account: { id: 'account1' },
};
expect(reducer(state, action).toJS()).toEqual({
new: {
isSubmitting: false,
accountId: 'account1',
notifications: true,
duration: 0,
},
});
});
it('should handle MUTES_TOGGLE_HIDE_NOTIFICATIONS', () => {
const state = ImmutableRecord({
new: ImmutableRecord({
isSubmitting: false,
accountId: null,
notifications: true,
duration: 0,
})(),
})();
const action = {
type: MUTES_TOGGLE_HIDE_NOTIFICATIONS,
};
expect(reducer(state, action).toJS()).toEqual({
new: {
isSubmitting: false,
accountId: null,
notifications: false,
duration: 0,
},
});
});
});

41
packages/pl-fe/src/reducers/mutes.ts
View file

@ -1,41 +0,0 @@
import { Record as ImmutableRecord } from 'immutable';
import {
MUTES_INIT_MODAL,
MUTES_TOGGLE_HIDE_NOTIFICATIONS,
MUTES_CHANGE_DURATION,
} from '../actions/mutes';
import type { AnyAction } from 'redux';
const NewMuteRecord = ImmutableRecord({
isSubmitting: false,
accountId: null as string | null,
notifications: true,
duration: 0,
});
const ReducerRecord = ImmutableRecord({
new: NewMuteRecord(),
});
type State = ReturnType<typeof ReducerRecord>;
const mutes = (state: State = ReducerRecord(), action: AnyAction) => {
switch (action.type) {
case MUTES_INIT_MODAL:
return state.withMutations((state) => {
state.setIn(['new', 'isSubmitting'], false);
state.setIn(['new', 'accountId'], action.account.id);
state.setIn(['new', 'notifications'], true);
});
case MUTES_TOGGLE_HIDE_NOTIFICATIONS:
return state.updateIn(['new', 'notifications'], (old) => !old);
case MUTES_CHANGE_DURATION:
return state.setIn(['new', 'duration'], action.duration);
default:
return state;
}
};
export { mutes as default };

4
packages/pl-fe/src/stores/modals.ts
View file

@ -1,6 +1,8 @@
import { create } from 'zustand';
import { mutative } from 'zustand-mutative';
import { MuteModalProps } from 'pl-fe/features/ui/components/modals/mute-modal';
import type { ICryptoAddress } from 'pl-fe/features/crypto-donate/components/crypto-address';
import type { ModalType } from 'pl-fe/features/ui/components/modal-root';
import type { AccountModerationModalProps } from 'pl-fe/features/ui/components/modals/account-moderation-modal';
@ -63,7 +65,7 @@ type OpenModalProps =
| [type: 'MEDIA', props: MediaModalProps]
| [type: 'MENTIONS', props: MentionsModalProps]
| [type: 'MISSING_DESCRIPTION', props: MissingDescriptionModalProps]
| [type: 'MUTE']
| [type: 'MUTE', props: MuteModalProps]
| [type: 'REACTIONS', props: ReactionsModalProps]
| [type: 'REBLOGS', props: ReblogsModalProps]
| [type: 'REPLY_MENTIONS', props: ReplyMentionsModalProps]