Prune the story progress effect's dependency list

This commit is contained in:
Josh Perez 2022-04-20 19:38:38 -04:00 committed by GitHub
parent 774246b6e2
commit 8c4b875dca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 50 additions and 43 deletions

View file

@ -2,7 +2,7 @@
// SPDX-License-Identifier: AGPL-3.0-only
import FocusTrap from 'focus-trap-react';
import React, { useState } from 'react';
import React, { useCallback, useState } from 'react';
import classNames from 'classnames';
import type { ConversationStoryType } from './StoryListItem';
import type { LocalizerType } from '../types/Util';
@ -42,34 +42,38 @@ export const Stories = ({
requiresFullWidth: true,
});
const onNextUserStories = useCallback(() => {
const storyIndex = stories.findIndex(
x => x.conversationId === conversationIdToView
);
if (storyIndex >= stories.length - 1 || storyIndex === -1) {
setConversationIdToView(undefined);
return;
}
const nextStory = stories[storyIndex + 1];
setConversationIdToView(nextStory.conversationId);
}, [conversationIdToView, stories]);
const onPrevUserStories = useCallback(() => {
const storyIndex = stories.findIndex(
x => x.conversationId === conversationIdToView
);
if (storyIndex <= 0) {
setConversationIdToView(undefined);
return;
}
const prevStory = stories[storyIndex - 1];
setConversationIdToView(prevStory.conversationId);
}, [conversationIdToView, stories]);
return (
<div className={classNames('Stories', themeClassName(Theme.Dark))}>
{conversationIdToView &&
renderStoryViewer({
conversationId: conversationIdToView,
onClose: () => setConversationIdToView(undefined),
onNextUserStories: () => {
const storyIndex = stories.findIndex(
x => x.conversationId === conversationIdToView
);
if (storyIndex >= stories.length - 1 || storyIndex === -1) {
setConversationIdToView(undefined);
return;
}
const nextStory = stories[storyIndex + 1];
setConversationIdToView(nextStory.conversationId);
},
onPrevUserStories: () => {
const storyIndex = stories.findIndex(
x => x.conversationId === conversationIdToView
);
if (storyIndex <= 0) {
setConversationIdToView(undefined);
return;
}
const prevStory = stories[storyIndex - 1];
setConversationIdToView(prevStory.conversationId);
},
onNextUserStories,
onPrevUserStories,
})}
<FocusTrap focusTrapOptions={{ allowOutsideClick: true }}>
<div className="Stories__pane" style={{ width }}>