Story: Fix various problems (#5935)

src/api/gramjs/helpers/localDb.ts

@@ -119,7 +119,7 @@ export function addDocumentToLocalDb(document: GramJs.TypeDocument) {
 export function addStoryRepairInfo<T extends GramJs.TypeDocument | GramJs.TypeWebDocument | GramJs.TypePhoto>(
   media: T, peerId: string, story: GramJs.TypeStoryItem,
 ): T & RepairInfo {
-  if (!(media instanceof GramJs.Document && media instanceof GramJs.Photo)) return media;
+  if (!(media instanceof GramJs.Document || media instanceof GramJs.Photo)) return media;
   const repairableMedia = media as T & RepairInfo;
   repairableMedia.localRepairInfo = {
     type: 'story',

src/api/gramjs/methods/client.ts

@@ -489,7 +489,6 @@ export async function repairFileReference({
   url: string;
 }) {
   const parsed = parseMediaUrl(url);
-
   if (!parsed) return undefined;
 
   const {

src/components/story/StoryCaption.tsx

@@ -65,21 +65,22 @@ function StoryCaption({
     canExpand, undefined, true, 'slow', true,
   );
 
+  // Setup gradient to clip caption before button
   useLayoutEffect(() => {
     requestMeasure(() => {
-      if (!showMoreButtonRef.current) {
+      const container = contentRef.current;
+      const button = showMoreButtonRef.current;
+      if (!container || !button) {
         return;
       }
 
-      const button = showMoreButtonRef.current;
-
       const { offsetWidth } = button;
 
       requestMutation(() => {
-        button.style.setProperty('--expand-button-width', `${offsetWidth}px`);
+        container.style.setProperty('--expand-button-width', `${offsetWidth}px`);
       });
     });
-  }, []);
+  }, [shouldRenderShowMore, lang]);
 
   useLayoutEffect(() => {
     requestForcedReflow(() => {

src/components/story/StoryPreview.tsx

@@ -97,7 +97,7 @@ function StoryPreview({
 export default memo(withGlobal<OwnProps>((global, { peer }): StateProps => {
   const {
     storyViewer: {
-      lastViewedByPeerIds,
+      lastViewedByPeerId: lastViewedByPeerIds,
       origin,
       storyList,
     },

src/global/actions/ui/stories.ts

@@ -97,7 +97,7 @@ addActionHandler('closeStoryViewer', (global, actions, payload): ActionReturnTyp
       isMuted,
       isRibbonShown,
       isArchivedRibbonShown,
-      lastViewedByPeerIds: undefined,
+      lastViewedByPeerId: undefined,
       storyList: undefined,
     },
   }, tabId);

src/global/intervals.ts

@@ -47,10 +47,9 @@ function checkStoryExpiration() {
   Object.values(global.stories.byPeerId).forEach((peerStories) => {
     const stories = Object.values(peerStories.byId);
     stories.forEach((story) => {
-      if (!('expireDate' in story)) return;
+      if (story['@type'] !== 'story') return;
       if (story.expireDate > serverTime) return;
-      if ('isInProfile' in story && story.isInProfile) return;
+      if (story.isInProfile) return;
-      if ('isPublic' in story && !story.isPublic) return;
 
       global = removePeerStory(global, story.peerId, story.id);
     });

src/global/reducers/stories.ts

@@ -200,8 +200,8 @@ export function updateLastViewedStoryForPeer<T extends GlobalState>(
   return updateTabState(global, {
     storyViewer: {
       ...storyViewer,
-      lastViewedByPeerIds: {
+      lastViewedByPeerId: {
-        ...storyViewer.lastViewedByPeerIds,
+        ...storyViewer.lastViewedByPeerId,
         [peerId]: lastViewedId,
       },
     },
@@ -313,7 +313,7 @@ export function removePeerStory<T extends GlobalState>(
   });
 
   Object.values(global.byTabId).forEach((tab) => {
-    if (tab.storyViewer.lastViewedByPeerIds?.[peerId] === storyId) {
+    if (tab.storyViewer.lastViewedByPeerId && tab.storyViewer.lastViewedByPeerId[peerId] === storyId) {
       global = updateLastViewedStoryForPeer(global, peerId, previousStoryId, tab.id);
     }
   });

src/global/types/tabState.ts

@@ -303,7 +303,7 @@ export type TabState = {
     isArchive?: boolean;
     // Last viewed story id in current view session.
     // Used for better switch animation between peers.
-    lastViewedByPeerIds?: Record<string, number>;
+    lastViewedByPeerId?: Record<string, number>;
     isPrivacyModalOpen?: boolean;
     isPaymentConfirmDialogOpen?: boolean;
     isStealthModalOpen?: boolean;