feat: added dismiss button to NoticeBanner

ts/components/NoticeBanner.tsx

@@ -1,21 +1,33 @@
 import React from 'react';
 import styled from 'styled-components';
 import { Flex } from './basic/Flex';
+import { SessionIconButton } from './icon';
 
 const StyledNoticeBanner = styled(Flex)`
+  position: relative;
   background-color: var(--primary-color);
   color: var(--background-primary-color);
   font-size: var(--font-size-lg);
   padding: var(--margins-xs) var(--margins-sm);
   text-align: center;
+
+  .session-icon-button {
+    position: absolute;
+    right: var(--margins-sm);
+  }
+`;
+
+const StyledText = styled.span`
+  margin-right: var(--margins-lg);
 `;
 
 type NoticeBannerProps = {
   text: string;
+  dismissCallback: () => void;
 };
 
 export const NoticeBanner = (props: NoticeBannerProps) => {
-  const { text } = props;
+  const { text, dismissCallback } = props;
 
   return (
     <StyledNoticeBanner
@@ -24,7 +36,16 @@ export const NoticeBanner = (props: NoticeBannerProps) => {
       justifyContent={'center'}
       alignItems={'center'}
     >
-      {text}
+      <StyledText>{text}</StyledText>
+      <SessionIconButton
+        iconType="exit"
+        iconColor="inherit"
+        iconSize="small"
+        onClick={event => {
+          event.preventDefault();
+          dismissCallback();
+        }}
+      />
     </StyledNoticeBanner>
   );
 };

ts/components/conversation/SessionConversation.tsx

@@ -261,6 +261,11 @@ export class SessionConversation extends React.Component<Props, State> {
                 text={window.i18n('disappearingMessagesModeOutdated', [
                   selectedConversation.hasOutdatedClient,
                 ])}
+                dismissCallback={() => {
+                  const conversation = getConversationController().get(selectedConversation.id);
+                  conversation.set({ hasOutdatedClient: undefined });
+                  conversation.commit();
+                }}
               />
             )}
         </div>