diff --git a/ts/components/NoticeBanner.tsx b/ts/components/NoticeBanner.tsx
index 7adf44220..70fce54fd 100644
--- a/ts/components/NoticeBanner.tsx
+++ b/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 (
{
justifyContent={'center'}
alignItems={'center'}
>
- {text}
+ {text}
+ {
+ event.preventDefault();
+ dismissCallback();
+ }}
+ />
);
};
diff --git a/ts/components/conversation/SessionConversation.tsx b/ts/components/conversation/SessionConversation.tsx
index f43540a01..5bf640d13 100644
--- a/ts/components/conversation/SessionConversation.tsx
+++ b/ts/components/conversation/SessionConversation.tsx
@@ -261,6 +261,11 @@ export class SessionConversation extends React.Component {
text={window.i18n('disappearingMessagesModeOutdated', [
selectedConversation.hasOutdatedClient,
])}
+ dismissCallback={() => {
+ const conversation = getConversationController().get(selectedConversation.id);
+ conversation.set({ hasOutdatedClient: undefined });
+ conversation.commit();
+ }}
/>
)}