Introduce TitleTransition notification

ts/components/conversation/TitleTransitionNotification.tsx

@@ -0,0 +1,39 @@
+// Copyright 2024 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import React from 'react';
+
+import type { LocalizerType } from '../../types/Util';
+import { Intl } from '../Intl';
+
+import { SystemMessage } from './SystemMessage';
+import { UserText } from '../UserText';
+
+export type PropsData = {
+  oldTitle: string;
+};
+
+export type PropsHousekeeping = {
+  i18n: LocalizerType;
+};
+
+export type Props = PropsData & PropsHousekeeping;
+
+export function TitleTransitionNotification(props: Props): JSX.Element {
+  const { i18n, oldTitle } = props;
+
+  return (
+    <SystemMessage
+      contents={
+        <Intl
+          id="icu:TitleTransition--notification"
+          components={{
+            oldTitle: <UserText text={oldTitle} />,
+          }}
+          i18n={i18n}
+        />
+      }
+      icon="thread"
+    />
+  );
+}