diff --git a/src/app/features/settings/Settings.tsx b/src/app/features/settings/Settings.tsx
index db62cb2c..3b28aad2 100644
--- a/src/app/features/settings/Settings.tsx
+++ b/src/app/features/settings/Settings.tsx
@@ -11,6 +11,7 @@ import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
import { UserAvatar } from '../../components/user-avatar';
import { nameInitials } from '../../utils/common';
import { Notifications } from './notifications';
+import { About } from './about';
enum SettingsPages {
GeneralPage,
@@ -168,6 +169,7 @@ export function Settings({ initialPage, requestClose }: SettingsProps) {
{activePage === SettingsPages.NotificationPage && (
)}
+ {activePage === SettingsPages.AboutPage && }
);
}
diff --git a/src/app/features/settings/about/About.tsx b/src/app/features/settings/about/About.tsx
new file mode 100644
index 00000000..b104d468
--- /dev/null
+++ b/src/app/features/settings/about/About.tsx
@@ -0,0 +1,243 @@
+import React from 'react';
+import { Box, Text, IconButton, Icon, Icons, Scroll, Button, config } from 'folds';
+import { Page, PageContent, PageHeader } from '../../../components/page';
+import { SequenceCard } from '../../../components/sequence-card';
+import { SequenceCardStyle } from '../styles.css';
+import { SettingTile } from '../../../components/setting-tile';
+import CinnySVG from '../../../../../public/res/svg/cinny.svg';
+import cons from '../../../../client/state/cons';
+import { clearCacheAndReload } from '../../../../client/initMatrix';
+import { useMatrixClient } from '../../../hooks/useMatrixClient';
+
+type AboutProps = {
+ requestClose: () => void;
+};
+export function About({ requestClose }: AboutProps) {
+ const mx = useMatrixClient();
+
+ return (
+
+
+
+
+
+ About
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+ Cinny
+ v{cons.version}
+
+ Yet another matrix client.
+
+
+
+ }
+ >
+ Source Code
+
+ }
+ >
+ Support
+
+
+
+
+
+
+ Credits
+
+
+
+
+ The{' '}
+
+ matrix-js-sdk
+ {' '}
+ is ©{' '}
+
+ The Matrix.org Foundation C.I.C
+ {' '}
+ used under the terms of{' '}
+
+ Apache 2.0
+
+ .
+
+
+
+
+ The{' '}
+
+ twemoji-colr
+ {' '}
+ font is ©{' '}
+
+ Mozilla Foundation
+ {' '}
+ used under the terms of{' '}
+
+ Apache 2.0
+
+ .
+
+
+
+
+ The{' '}
+
+ Twemoji
+ {' '}
+ emoji art is ©{' '}
+
+ Twitter, Inc and other contributors
+ {' '}
+ used under the terms of{' '}
+
+ CC-BY 4.0
+
+ .
+
+
+
+
+ The{' '}
+
+ Material sound resources
+ {' '}
+ are ©{' '}
+
+ Google
+ {' '}
+ used under the terms of{' '}
+
+ CC-BY 4.0
+
+ .
+
+
+
+
+
+
+
+ Options
+
+ clearCacheAndReload(mx)}
+ variant="Secondary"
+ fill="Soft"
+ size="300"
+ radii="300"
+ outlined
+ >
+ Clear Cache
+
+ }
+ />
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/app/features/settings/about/index.ts b/src/app/features/settings/about/index.ts
new file mode 100644
index 00000000..da0f79eb
--- /dev/null
+++ b/src/app/features/settings/about/index.ts
@@ -0,0 +1 @@
+export * from './About';