diff --git a/jest.config.js b/jest.config.js deleted file mode 100644 index 91a2d2c..0000000 --- a/jest.config.js +++ /dev/null @@ -1,4 +0,0 @@ -module.exports = { - preset: 'ts-jest', - testEnvironment: 'node', -}; \ No newline at end of file diff --git a/public/index.html b/public/index.html deleted file mode 100644 index 823d8d4..0000000 --- a/public/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - - - Matrix.to - - - -
- - diff --git a/src/App.scss b/src/App.scss deleted file mode 100644 index e568c3e..0000000 --- a/src/App.scss +++ /dev/null @@ -1,42 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import './color-scheme'; - -#root { - background-color: $app-background; - background-image: url('./imgs/background.svg'); - background-repeat: no-repeat; - background-size: cover; -} - -@mixin spacer { - width: 100%; - flex-grow: 0; - flex-shrink: 0; -} - -.topSpacer { - @include spacer; - - height: 10vh; -} - -.bottomSpacer { - @include spacer; - - height: 10vh; -} diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index fe11e17..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,76 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useState, useEffect } from 'react'; - -import SingleColumn from './layouts/SingleColumn'; -import CreateLinkTile from './components/CreateLinkTile'; -import MatrixTile from './components/MatrixTile'; -import Tile from './components/Tile'; -import LinkRouter from './pages/LinkRouter'; - -import './App.scss'; - -import GlobalContext from './contexts/GlobalContext'; - -/* eslint-disable no-restricted-globals */ - -const App: React.FC = () => { - let page = ( - <> - - - ); - - const [hash, setHash] = useState(location.hash); - - console.log(`Link for ${hash}`); - - useEffect(() => { - // Some hacky uri decoding - if (location.href.split('/').length > 4) { - location.href = decodeURIComponent(location.href); - } - - window.onhashchange = () => setHash(location.hash); - }, []); - - if (hash) { - if (hash.startsWith('#/')) { - page = ; - } else { - page = ( - - Links should be in the format {location.host}/#/{'<'} - matrix-resource-identifier{'>'} - - ); - } - } - - return ( - - -
- {page} - -
- - - ); -}; - -export default App; diff --git a/src/_color-scheme.scss b/src/_color-scheme.scss deleted file mode 100644 index 1c32596..0000000 --- a/src/_color-scheme.scss +++ /dev/null @@ -1,25 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -$app-background: #f4f4f4; -$background: #ffffff; -$foreground: #000000; -$font: #333333; -$grey: #666666; -$accent: #0098d4; -$error: #d6001c; -$link: #0098d4; -$borders: #f4f4f4; diff --git a/src/_error.scss b/src/_error.scss deleted file mode 100644 index 2845abb..0000000 --- a/src/_error.scss +++ /dev/null @@ -1,20 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@mixin error { - color: $error; - border-color: $error; -} diff --git a/src/_mixins.scss b/src/_mixins.scss deleted file mode 100644 index 5cff438..0000000 --- a/src/_mixins.scss +++ /dev/null @@ -1,11 +0,0 @@ -@mixin unreal-focus { - outline-width: 2px; - outline-style: solid; - outline-color: Highlight; - - /* WebKit gets its native focus styles. */ - @media (-webkit-min-device-pixel-ratio: 0) { - outline-color: -webkit-focus-ring-color; - outline-style: auto; - } -} diff --git a/src/clients/Element.ts b/src/clients/Element.ts deleted file mode 100644 index 37e3db0..0000000 --- a/src/clients/Element.ts +++ /dev/null @@ -1,106 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import { - LinkedClient, - Maturity, - ClientKind, - ClientId, - Platform, - AppleStoreLink, - PlayStoreLink, - FDroidLink, -} from './types'; -import { LinkKind } from '../parser/types'; -import logo from '../imgs/element.svg'; - -export const Element: LinkedClient = { - kind: ClientKind.LINKED_CLIENT, - name: 'Element', - author: 'Element', - logo: logo, - homepage: 'https://element.io', - maturity: Maturity.STABLE, - description: 'Fully-featured Matrix client', - platforms: [Platform.Desktop, Platform.Android, Platform.iOS], - experimental: false, - clientId: ClientId.Element, - toUrl: (link) => { - const params = link.arguments.originalParams.toString(); - const prefixedParams = params ? `?${params}` : ''; - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return new URL( - `https://app.element.io/#/room/${link.identifier}${prefixedParams}` - ); - case LinkKind.UserId: - return new URL( - `https://app.element.io/#/user/${link.identifier}${prefixedParams}` - ); - case LinkKind.Permalink: - return new URL( - `https://app.element.io/#/room/${link.identifier}${prefixedParams}` - ); - case LinkKind.GroupId: - return new URL( - `https://app.element.io/#/group/${link.identifier}${prefixedParams}` - ); - } - }, - linkSupport: () => true, - installLinks: [ - new AppleStoreLink('vector', 'id1083446067'), - new PlayStoreLink('im.vector.app'), - new FDroidLink('im.vector.app'), - ], -}; - -export const ElementDevelop: LinkedClient = { - kind: ClientKind.LINKED_CLIENT, - name: 'Element Develop', - author: 'Element', - logo: logo, - homepage: 'https://element.io', - maturity: Maturity.STABLE, - description: 'Fully-featured Matrix client for the Web', - platforms: [Platform.Desktop], - experimental: true, - clientId: ClientId.ElementDevelop, - toUrl: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return new URL( - `https://develop.element.io/#/room/${link.identifier}` - ); - case LinkKind.UserId: - return new URL( - `https://develop.element.io/#/user/${link.identifier}` - ); - case LinkKind.Permalink: - return new URL( - `https://develop.element.io/#/room/${link.identifier}` - ); - case LinkKind.GroupId: - return new URL( - `https://develop.element.io/#/group/${link.identifier}` - ); - } - }, - linkSupport: () => true, - installLinks: [], -}; diff --git a/src/clients/Fractal.tsx b/src/clients/Fractal.tsx deleted file mode 100644 index f9ea9a2..0000000 --- a/src/clients/Fractal.tsx +++ /dev/null @@ -1,75 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import { TextClient, Maturity, ClientKind, ClientId, Platform } from './types'; - -import { LinkKind } from '../parser/types'; - -import logo from '../imgs/fractal.png'; - -const Fractal: TextClient = { - kind: ClientKind.TEXT_CLIENT, - name: 'Fractal', - logo: logo, - author: 'Daniel Garcia Moreno', - homepage: 'https://github.com/poljar/weechat-matrix', - maturity: Maturity.BETA, - experimental: false, - platforms: [Platform.Desktop], - clientId: ClientId.Fractal, - toInviteString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - case LinkKind.UserId: - return ( - - Click the '+' button in the top right and paste the - identifier - - ); - default: - return Fractal doesn't support this kind of link; - } - }, - copyString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - case LinkKind.UserId: - return `${link.identifier}`; - default: - return ''; - } - }, - linkSupport: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - case LinkKind.UserId: - return true; - default: - return false; - } - }, - - description: 'Fractal is a Matrix Client written in Rust', - installLinks: [], -}; - -export default Fractal; diff --git a/src/clients/Nheko.tsx b/src/clients/Nheko.tsx deleted file mode 100644 index f9201d3..0000000 --- a/src/clients/Nheko.tsx +++ /dev/null @@ -1,92 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import { TextClient, Maturity, ClientKind, ClientId, Platform } from './types'; - -import { LinkKind } from '../parser/types'; - -import logo from '../imgs/nheko.svg'; - -const Nheko: TextClient = { - kind: ClientKind.TEXT_CLIENT, - name: 'Nheko', - logo: logo, - author: 'mujx, red_sky, deepbluev7, Konstantinos Sideris', - homepage: 'https://github.com/Nheko-Reborn/nheko', - maturity: Maturity.BETA, - experimental: false, - platforms: [Platform.Desktop], - clientId: ClientId.Nheko, - toInviteString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return ( - - Type{' '} - - /join{' '} - - {link.identifier} - - - - ); - case LinkKind.UserId: - return ( - - Type{' '} - - /invite{' '} - - {link.identifier} - - - - ); - default: - return Nheko doesn't support this kind of link; - } - }, - copyString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return `/join ${link.identifier}`; - case LinkKind.UserId: - return `/invite ${link.identifier}`; - default: - return ''; - } - }, - linkSupport: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - case LinkKind.UserId: - return true; - default: - return false; - } - }, - description: - 'A native desktop app for Matrix that feels more like a mainstream chat app.', - installLinks: [], -}; - -export default Nheko; diff --git a/src/clients/Weechat.tsx b/src/clients/Weechat.tsx deleted file mode 100644 index 805a4b2..0000000 --- a/src/clients/Weechat.tsx +++ /dev/null @@ -1,92 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import { TextClient, Maturity, ClientKind, ClientId, Platform } from './types'; - -import { LinkKind } from '../parser/types'; - -import logo from '../imgs/weechat.svg'; - -const Weechat: TextClient = { - kind: ClientKind.TEXT_CLIENT, - name: 'Weechat', - logo: logo, - author: 'Poljar', - homepage: 'https://github.com/poljar/weechat-matrix', - maturity: Maturity.LATE_BETA, - experimental: false, - platforms: [Platform.Desktop], - clientId: ClientId.WeeChat, - toInviteString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return ( - - Type{' '} - - /join{' '} - - {link.identifier} - - - - ); - case LinkKind.UserId: - return ( - - Type{' '} - - /invite{' '} - - {link.identifier} - - - - ); - default: - return Weechat doesn't support this kind of link; - } - }, - copyString: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - return `/join ${link.identifier}`; - case LinkKind.UserId: - return `/invite ${link.identifier}`; - default: - return ''; - } - }, - linkSupport: (link) => { - switch (link.kind) { - case LinkKind.Alias: - case LinkKind.RoomId: - case LinkKind.UserId: - return true; - default: - return false; - } - }, - - description: 'Command-line Matrix interface using Weechat', - installLinks: [], -}; - -export default Weechat; diff --git a/src/clients/index.ts b/src/clients/index.ts deleted file mode 100644 index a00cd71..0000000 --- a/src/clients/index.ts +++ /dev/null @@ -1,45 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import { Client } from './types'; - -import { Element, ElementDevelop } from './Element'; -import Weechat from './Weechat'; -import Nheko from './Nheko'; -import Fractal from './Fractal'; - -/* - * All the supported clients of matrix.to - */ -const clients: Client[] = [Element, Weechat, Nheko, Fractal, ElementDevelop]; - -/* - * A map from sharer string to client. - * Configured by hand so we can change the mappings - * easily later. - */ -export const clientMap: { [key: string]: Client } = { - [Element.clientId]: Element, - [Weechat.clientId]: Weechat, - [ElementDevelop.clientId]: ElementDevelop, - [Nheko.clientId]: Nheko, - [Fractal.clientId]: Fractal, -}; - -/* - * All the supported clients of matrix.to - */ -export default clients; diff --git a/src/clients/types.ts b/src/clients/types.ts deleted file mode 100644 index 9c4c266..0000000 --- a/src/clients/types.ts +++ /dev/null @@ -1,168 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import { SafeLink } from '../parser/types'; - -/* - * A collection of descriptive tags that can be added to - * a clients description. - */ -export enum Platform { - iOS = 'iOS', - Android = 'ANDROID', - Desktop = 'DESKTOP', -} - -/* - * A collection of states used for describing a clients maturity. - */ -export enum Maturity { - ALPHA = 'ALPHA', - LATE_ALPHA = 'LATE ALPHA', - BETA = 'BETA', - LATE_BETA = 'LATE_BETA', - STABLE = 'STABLE', -} - -/* - * Used for constructing the discriminated union of all client types. - */ -export enum ClientKind { - LINKED_CLIENT = 'LINKED_CLIENT', - TEXT_CLIENT = 'TEXT_CLIENT', -} - -export enum ClientId { - Element = 'element.io', - ElementDevelop = 'develop.element.io', - WeeChat = 'weechat', - Nheko = 'nheko', - Fractal = 'fractal', -} - -/** - * Define a native distribution channel for a client. - * E.g App store for apple, PlayStore or F-Droid for Android - */ -export interface InstallLink { - createInstallURL(deepLink: SafeLink) : string; - // in AppleStoreLink, we can set the cookie here for deeplinking - // onInstallChosen(deepLink: SafeLink); - platform: Platform; - channelId: string; - description: string; -} - -export class AppleStoreLink implements InstallLink { - constructor(private org: string, private appId: string) {} - - createInstallURL(deepLink: SafeLink) : string { - return `https://apps.apple.com/app/${encodeURIComponent(this.org)}/${encodeURIComponent(this.appId)}`; - } - - get platform() : Platform { - return Platform.iOS; - } - - get channelId(): string { - return "apple-app-store"; - } - - get description() { - return "Download on the App Store"; - } -} - -export class PlayStoreLink implements InstallLink { - constructor(private appId: string) {} - - createInstallURL(deepLink: SafeLink) : string { - return `https://play.google.com/store/apps/details?id=${encodeURIComponent(this.appId)}&referrer=${encodeURIComponent(deepLink.originalLink)}`; - } - - get platform() : Platform { - return Platform.Android; - } - - get channelId(): string { - return "play-store"; - } - - get description() { - return "Get it on Google Play"; - } -} - -export class FDroidLink implements InstallLink { - constructor(private appId: string) {} - - createInstallURL(deepLink: SafeLink) : string { - return `https://f-droid.org/packages/${encodeURIComponent(this.appId)}`; - } - - get platform() : Platform { - return Platform.Android; - } - - get channelId(): string { - return "fdroid"; - } - - get description() { - return "Get it on F-Droid"; - } -} - -/* - * The descriptive details of a client - */ -export interface ClientDescription { - name: string; - author: string; - homepage: string; - logo: string; - description: string; - platforms: Platform[]; - maturity: Maturity; - clientId: ClientId; - experimental: boolean; - linkSupport: (link: SafeLink) => boolean; - installLinks: InstallLink[]; -} - -/* - * A client which can be opened using a link with the matrix resource. - */ -export interface LinkedClient extends ClientDescription { - kind: ClientKind.LINKED_CLIENT; - toUrl(parsedLink: SafeLink): URL; -} - -/* - * A client which provides isntructions for how to access the descired - * resource. - */ -export interface TextClient extends ClientDescription { - kind: ClientKind.TEXT_CLIENT; - toInviteString(parsedLink: SafeLink): JSX.Element; - copyString(parsedLink: SafeLink): string; -} - -/* - * A description for a client as well as a method for converting matrix.to - * links to the client's specific representation. - */ -export type Client = LinkedClient | TextClient; diff --git a/src/components/Avatar.scss b/src/components/Avatar.scss deleted file mode 100644 index 6767f2a..0000000 --- a/src/components/Avatar.scss +++ /dev/null @@ -1,29 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.avatar { - border-radius: 100%; - border: 1px solid $borders; - height: 60px; - width: 60px; -} - -.avatarNoCrop { - border-radius: 0; - border: 0; -} diff --git a/src/components/Avatar.stories.tsx b/src/components/Avatar.stories.tsx deleted file mode 100644 index 1032c18..0000000 --- a/src/components/Avatar.stories.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -// disable camelcase check because our object keys come -// from the matrix spec -/* eslint-disable @typescript-eslint/camelcase */ - -import React from 'react'; - -import { UserAvatar } from './Avatar'; - -export default { - title: 'Avatar', - parameters: { - design: { - type: 'figma', - url: - 'https://www.figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853', - }, - }, -}; - -export const Default: React.FC<{}> = () => ( - -); diff --git a/src/components/Avatar.tsx b/src/components/Avatar.tsx deleted file mode 100644 index adf99ac..0000000 --- a/src/components/Avatar.tsx +++ /dev/null @@ -1,121 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useEffect, useState } from 'react'; -import classNames from 'classnames'; - -import { Group, Room, User } from '../matrix-cypher'; -import useHSs from '../utils/getHS'; -import { getThumbnailURI } from '../utils/cypher-wrapper'; -import logo from '../imgs/chat-icon.svg'; - -import './Avatar.scss'; - -const AVATAR_SIZE = 96; - -interface IProps { - className?: string; - avatarUrl: string; - label: string; -} - -const Avatar: React.FC = ({ className, avatarUrl, label }: IProps) => { - const [src, setSrc] = useState(avatarUrl); - useEffect(() => { - setSrc(avatarUrl ? avatarUrl : logo); - }, [avatarUrl]); - - const _className = classNames('avatar', className, { - avatarNoCrop: src === logo, - }); - return ( - setSrc(logo)} - alt={label} - className={_className} - /> - ); -}; - -interface IPropsUserAvatar { - user: User; - userId: string; -} - -export const UserAvatar: React.FC = ({ - user, - userId, -}: IPropsUserAvatar) => { - const [hs] = useHSs({ identifier: userId }); - return ( - - ); -}; - -interface IPropsRoomAvatar { - room: Room; -} - -export const RoomAvatar: React.FC = ({ - room, -}: IPropsRoomAvatar) => { - const [hs] = useHSs({ identifier: room.room_id }); - return ( - - ); -}; - -interface IPropsGroupAvatar { - group: Group; - groupId: string; -} - -export const GroupAvatar: React.FC = ({ - group, - groupId, -}: IPropsGroupAvatar) => { - const [hs] = useHSs({ identifier: groupId }); - return ( - - ); -}; - -export default Avatar; diff --git a/src/components/Button.scss b/src/components/Button.scss deleted file mode 100644 index 25997ab..0000000 --- a/src/components/Button.scss +++ /dev/null @@ -1,65 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.button { - width: 100%; - - height: 48px; - - border-radius: 24px; - border: 0; - - background-color: $accent; - color: $background; - - font-size: 15px; - font-weight: 500; - - display: inline-flex; - justify-content: center; - align-items: center; - - &:hover { - cursor: pointer; - } - - position: relative; - - .buttonIcon { - position: absolute; - height: 24px; - width: 24px; - - left: 18px; - top: 12px; - } -} - -.buttonSecondary { - background-color: $background; - color: $foreground; - border: 1px solid $foreground; -} - -.errorButton:hover { - cursor: not-allowed; -} - -.buttonHighlight { - background-color: $accent; -} diff --git a/src/components/Button.stories.tsx b/src/components/Button.stories.tsx deleted file mode 100644 index 25cfee8..0000000 --- a/src/components/Button.stories.tsx +++ /dev/null @@ -1,33 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import { action } from '@storybook/addon-actions'; -import { text } from '@storybook/addon-knobs'; - -import Button from './Button'; - -export default { title: 'Button' }; - -export const WithText: React.FC = () => ( - -); - -export const Secondary: React.FC = () => ( - -); diff --git a/src/components/Button.tsx b/src/components/Button.tsx deleted file mode 100644 index fd031f2..0000000 --- a/src/components/Button.tsx +++ /dev/null @@ -1,89 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import classnames from 'classnames'; - -import './Button.scss'; - -interface IProps extends React.ButtonHTMLAttributes { - // Briefly display these instead of the children onClick - flashChildren?: React.ReactNode; - secondary?: boolean; - icon?: string; - flashIcon?: string; -} - -/** - * Like a normal button except it will flash content when clicked. - */ -const Button: React.FC< - IProps & React.RefAttributes -> = React.forwardRef( - ( - { - onClick, - children, - flashChildren, - className, - secondary, - icon, - flashIcon, - ...props - }: IProps, - ref: React.Ref - ) => { - const [wasClicked, setWasClicked] = React.useState(false); - - const wrappedOnClick: React.MouseEventHandler = (e) => { - if (onClick) { - onClick(e); - } - - setWasClicked(true); - window.setTimeout(() => { - setWasClicked(false); - }, 1000); - }; - - const content = wasClicked && flashChildren ? flashChildren : children; - - const classNames = classnames('button', className, { - buttonHighlight: wasClicked, - buttonSecondary: secondary, - }); - - const iconSrc = wasClicked && flashIcon ? flashIcon : icon; - - const buttonIcon = icon ? ( - - ) : null; - - return ( - - ); - } -); - -export default Button; diff --git a/src/components/ClientList.scss b/src/components/ClientList.scss deleted file mode 100644 index 24c8823..0000000 --- a/src/components/ClientList.scss +++ /dev/null @@ -1,22 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.clientList { - display: grid; - row-gap: 20px; - list-style-type: none; - padding-inline-start: 0; -} diff --git a/src/components/ClientList.tsx b/src/components/ClientList.tsx deleted file mode 100644 index 64dbebc..0000000 --- a/src/components/ClientList.tsx +++ /dev/null @@ -1,98 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useContext } from 'react'; -import { UAContext } from '@quentin-sommer/react-useragent'; - -import { SafeLink } from '../parser/types'; -import { ActionType, ClientContext } from '../contexts/ClientContext'; -import Clients from '../clients'; -import { Client, Platform } from '../clients/types'; -import ClientTile from './ClientTile'; - -import './ClientList.scss'; - -interface IProps { - link: SafeLink; - rememberSelection: boolean; -} - -const ClientList: React.FC = ({ link, rememberSelection }: IProps) => { - const [ - { showOnlyDeviceClients, showExperimentalClients }, - clientDispatcher, - ] = useContext(ClientContext); - const { uaResults } = useContext(UAContext); - - /* - * Function to decide whether a client is shown - */ - const showClient = (client: Client): boolean => { - let showClient = false; - - if (!showOnlyDeviceClients || uaResults === {}) { - showClient = true; - } - - for (const platform of client.platforms) { - switch (platform) { - case Platform.Desktop: - showClient = showClient || !(uaResults as any).mobile; - break; - case Platform.iOS: - showClient = showClient || (uaResults as any).ios; - break; - case Platform.Android: - showClient = showClient || (uaResults as any).android; - break; - } - } - - if (!showExperimentalClients && client.experimental) { - showClient = false; - } - - if (!client.linkSupport(link)) { - showClient = false; - } - - return showClient; - }; - - const clientLi = (client: Client): JSX.Element => ( -
  • - rememberSelection - ? clientDispatcher({ - action: ActionType.SetClient, - clientId: client.clientId, - }) - : undefined - } - > - -
  • - ); - - return ( -
      - {Clients.filter(showClient).map(clientLi)} -
    - ); -}; - -export default ClientList; diff --git a/src/components/ClientSelection.scss b/src/components/ClientSelection.scss deleted file mode 100644 index f4977b7..0000000 --- a/src/components/ClientSelection.scss +++ /dev/null @@ -1,27 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.advanced { - display: grid; - row-gap: 20px; - - .advancedOptions { - display: flex; - flex-direction: column; - - align-items: flex-start; - } -} diff --git a/src/components/ClientSelection.tsx b/src/components/ClientSelection.tsx deleted file mode 100644 index 6e5ed8d..0000000 --- a/src/components/ClientSelection.tsx +++ /dev/null @@ -1,88 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useContext, useState } from 'react'; - -import './ClientSelection.scss'; -import { ActionType, ClientContext } from '../contexts/ClientContext'; -import ClientList from './ClientList'; -import { SafeLink } from '../parser/types'; -import Button from './Button'; -import StyledCheckbox from './StyledCheckbox'; - -interface IProps { - link: SafeLink; -} - -const ClientSelection: React.FC = ({ link }: IProps) => { - const [clientState, clientStateDispatch] = useContext(ClientContext); - const [rememberSelection, setRememberSelection] = useState(false); - const options = ( -
    - { - setRememberSelection(!rememberSelection); - }} - checked={rememberSelection} - > - Remember for future invites in this browser - - { - clientStateDispatch({ - action: ActionType.ToggleShowOnlyDeviceClients, - }); - }} - checked={clientState.showOnlyDeviceClients} - > - Show only clients suggested for this device - - { - clientStateDispatch({ - action: ActionType.ToggleShowExperimentalClients, - }); - }} - checked={clientState.showExperimentalClients} - > - Show experimental clients - -
    - ); - - const clearSelection = - clientState.clientId !== null ? ( - - ) : null; - - return ( -
    - {options} - - {clearSelection} -
    - ); -}; - -export default ClientSelection; diff --git a/src/components/ClientTile.scss b/src/components/ClientTile.scss deleted file mode 100644 index a697aea..0000000 --- a/src/components/ClientTile.scss +++ /dev/null @@ -1,85 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.clientTile { - display: flex; - flex-direction: row; - align-items: flex-start; - - min-height: 150px; - width: 100%; - - color: $foreground; - - > img { - flex-shrink: 0; - height: 116px; - width: 116px; - margin-right: 14px; - border-radius: 16px; - } - - > div { - display: flex; - flex-direction: column; - justify-content: space-between; - h1 { - text-align: left; - font-size: 14px; - line-height: 24px; - } - - p { - margin-right: 8px; - text-align: left; - } - - .button { - height: 40px; - min-width: 130px; - max-width: 165px; - margin-top: 16px; - } - } - - border-radius: 8px; - - padding: 15px; - - // For the chevron - position: relative; - - &:hover { - background-color: $app-background; - } - - .installLink { - display: inline-block; - height: 40px; - margin: 8px 16px 8px 0; - img { - height: 100%; - } - } -} - -.clientTileLink { - position: relative; - - width: 100%; -} diff --git a/src/components/ClientTile.tsx b/src/components/ClientTile.tsx deleted file mode 100644 index 9464e61..0000000 --- a/src/components/ClientTile.tsx +++ /dev/null @@ -1,125 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useContext } from 'react'; -import classNames from 'classnames'; -import { UAContext } from '@quentin-sommer/react-useragent'; - -import { Client, ClientKind, Platform } from '../clients/types'; -import { SafeLink } from '../parser/types'; -import Tile from './Tile'; -import Button from './Button'; - -import appStoreBadge from '../imgs/app-store-us-alt.svg'; -import playStoreBadge from '../imgs/google-play-us.svg'; -import fdroidBadge from '../imgs/fdroid-badge.png'; - -import './ClientTile.scss'; - -interface IProps { - client: Client; - link: SafeLink; -} - -interface IInstallBadgeImages { - [index: string]: string; -} - -const installBadgeImages : IInstallBadgeImages = { - "fdroid": fdroidBadge, - "apple-app-store": appStoreBadge, - "play-store": playStoreBadge -}; - -const ClientTile: React.FC = ({ client, link }: IProps) => { - const inviteLine = - client.kind === ClientKind.TEXT_CLIENT ? ( -

    {client.toInviteString(link)}

    - ) : null; - - const { uaResults } = useContext(UAContext); - - const className = classNames('clientTile', { - clientTileLink: client.kind === ClientKind.LINKED_CLIENT, - }); - - let inviteButton: JSX.Element = <>; - const matchingInstallLinks = client.installLinks.filter((installLink) => { - if ((uaResults as any).ios) { - return installLink.platform === Platform.iOS; - } else if ((uaResults as any).android) { - return installLink.platform === Platform.Android; - } else { - return false; - } - }); - const hasNativeClient = matchingInstallLinks.length > 0; - let installButtons = undefined; - if (matchingInstallLinks.length) { - installButtons =

    {matchingInstallLinks.map((installLink) => { - return - {installLink.description} - ; - })}

    ; - } - - if (client.kind === ClientKind.LINKED_CLIENT) { - inviteButton = ; - } else { - const copyString = client.copyString(link); - if (copyString !== '') { - inviteButton = ( - - ); - } - } - - let clientTile = ( - - {client.name -
    -

    {client.name}

    -

    {client.description}

    - {installButtons} - {inviteLine} - {inviteButton} -
    -
    - ); - - if (client.kind === ClientKind.LINKED_CLIENT) { - if (!hasNativeClient) { - clientTile = ( - {clientTile} - ); - } - } - - return clientTile; -}; - -export default ClientTile; diff --git a/src/components/CreateLinkTile.scss b/src/components/CreateLinkTile.scss deleted file mode 100644 index e302aff..0000000 --- a/src/components/CreateLinkTile.scss +++ /dev/null @@ -1,92 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.createLinkTile { - row-gap: 24px; - - * { - width: 100%; - } - - > form { - display: grid; - row-gap: 24px; - align-self: center; - } - - > a { - color: $foreground; - font-weight: bold; - font-size: 24px; - line-height: 32px; - text-align: left; - text-decoration: underline; - } - - .createLinkReset { - height: 40px; - width: 40px; - - border-radius: 100%; - border: 1px solid lighten($grey, 50%); - - background: $background; - - padding: 6px; - - position: relative; - - > div { - // This is a terrible case of faking it till - // we make it. It will break. I'm so sorry - position: absolute; - display: none; - - width: max-content; - top: -35px; - left: -17px; - - border-radius: 30px; - padding: 5px 15px; - - background: $background; - - word-wrap: none; - } - - img { - height: 100%; - width: 100%; - border: 0; - - filter: invert(12%); - } - - &:hover { - border: 0; - - background: $foreground; - - cursor: pointer; - - > div { - display: block; - } - } - } -} diff --git a/src/components/CreateLinkTile.stories.tsx b/src/components/CreateLinkTile.stories.tsx deleted file mode 100644 index 48d7e5c..0000000 --- a/src/components/CreateLinkTile.stories.tsx +++ /dev/null @@ -1,32 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import CreateLinkTile from './CreateLinkTile'; - -export default { - title: 'CreateLinkTile', - parameters: { - design: { - type: 'figma', - url: - 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1', - }, - }, -}; - -export const Default: React.FC = () => ; diff --git a/src/components/CreateLinkTile.tsx b/src/components/CreateLinkTile.tsx deleted file mode 100644 index 35950fd..0000000 --- a/src/components/CreateLinkTile.tsx +++ /dev/null @@ -1,158 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useEffect, useRef } from 'react'; -import { Formik, Form } from 'formik'; - -import Tile from './Tile'; -import Button from './Button'; -import Input from './Input'; -import { parseHash } from '../parser/parser'; -import { LinkKind } from '../parser/types'; -import linkIcon from '../imgs/link.svg'; -import copyIcon from '../imgs/copy.svg'; -import tickIcon from '../imgs/tick.svg'; -import refreshIcon from '../imgs/refresh.svg'; -import './CreateLinkTile.scss'; - -interface ILinkNotCreatedTileProps { - setLink: React.Dispatch>; -} - -interface FormValues { - identifier: string; -} - -// Hacky use of types here -function validate(values: FormValues): Partial { - const errors: Partial = {}; - - if (values.identifier === '') { - errors.identifier = ''; - return errors; - } - - const parse = parseHash(values.identifier); - - if (parse.kind === LinkKind.ParseFailed) { - errors.identifier = - "That identifier doesn't look right. Double check the details."; - } - - return errors; -} - -const LinkNotCreatedTile: React.FC = ( - props: ILinkNotCreatedTileProps -) => { - return ( - -

    - Create shareable links to Matrix rooms, users or messages - without being tied to any app -

    - { - props.setLink( - document.location.protocol + - '//' + - document.location.host + - '/#/' + - values.identifier - ); - }} - > - {(formik): JSX.Element => ( -
    - - -
    - )} -
    -
    - ); -}; - -interface ILinkCreatedTileProps { - link: string; - setLink: React.Dispatch>; -} - -const LinkCreatedTile: React.FC = (props) => { - const buttonRef = useRef(null); - - // Focus button on render - useEffect((): void => { - if (buttonRef && buttonRef.current) { - buttonRef.current.focus(); - } - }); - - return ( - - - - {props.link} - - - - ); -}; - -const CreateLinkTile: React.FC = () => { - const [link, setLink] = React.useState(''); - if (!link) { - return ; - } else { - return ; - } -}; - -export default CreateLinkTile; diff --git a/src/components/DefaultPreview.scss b/src/components/DefaultPreview.scss deleted file mode 100644 index 21b77bb..0000000 --- a/src/components/DefaultPreview.scss +++ /dev/null @@ -1,22 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.defaultPreview { - .avatar { - border-radius: 0; - border: 0; - } -} diff --git a/src/components/DefaultPreview.tsx b/src/components/DefaultPreview.tsx deleted file mode 100644 index 00f4b91..0000000 --- a/src/components/DefaultPreview.tsx +++ /dev/null @@ -1,42 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import { SafeLink } from '../parser/types'; -import Avatar from './Avatar'; - -import './DefaultPreview.scss'; - -import genericRoomPreview from '../imgs/chat-icon.svg'; - -interface IProps { - link: SafeLink; -} - -const DefaultPreview: React.FC = ({ link }: IProps) => { - return ( -
    - -

    {link.identifier}

    -
    - ); -}; - -export default DefaultPreview; diff --git a/src/components/Details.scss b/src/components/Details.scss deleted file mode 100644 index 8fc8e6f..0000000 --- a/src/components/Details.scss +++ /dev/null @@ -1,46 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../mixins'; - -.details { - display: flex; - - > :first-child { - min-width: 100%; - } - - > input[type='checkbox'] { - // Remove the OS's representation - display: none; - - &.focus-visible { - & + img { - @include unreal-focus; - } - } - - &:checked { - & + img { - transform: rotate(180deg); - } - } - } - - &:hover { - cursor: pointer; - } -} diff --git a/src/components/Details.tsx b/src/components/Details.tsx deleted file mode 100644 index afa91d8..0000000 --- a/src/components/Details.tsx +++ /dev/null @@ -1,35 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import chevron from '../imgs/chevron-down.svg'; - -import './Details.scss'; - -interface IProps extends React.InputHTMLAttributes { - children?: React.ReactNode; -} - -const Details: React.FC = ({ children, ...props }: IProps) => ( - -); - -export default Details; diff --git a/src/components/EventPreview.tsx b/src/components/EventPreview.tsx deleted file mode 100644 index 00ac979..0000000 --- a/src/components/EventPreview.tsx +++ /dev/null @@ -1,35 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import { Room, Event } from '../matrix-cypher'; - -import RoomPreview from './RoomPreview'; - -interface IProps { - room: Room; - event: Event; -} - -const EventPreview: React.FC = ({ room, event }: IProps) => ( - <> - -

    "{event.content}"

    -

    {event.sender}

    - -); - -export default EventPreview; diff --git a/src/components/FakeProgress.scss b/src/components/FakeProgress.scss deleted file mode 100644 index 32cd224..0000000 --- a/src/components/FakeProgress.scss +++ /dev/null @@ -1,31 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.fakeProgress { - width: 100%; - height: 4px; - background-color: lighten($grey, 50%); - border-radius: 4px; - - > div { - width: 60%; - height: 100%; - background-color: $foreground; - border-radius: 4px; - } -} diff --git a/src/components/FakeProgress.tsx b/src/components/FakeProgress.tsx deleted file mode 100644 index 587a7e3..0000000 --- a/src/components/FakeProgress.tsx +++ /dev/null @@ -1,27 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import './FakeProgress.scss'; - -const FakeProgress = () => ( -
    -
    -
    -); - -export default FakeProgress; diff --git a/src/components/Footer.scss b/src/components/Footer.scss deleted file mode 100644 index ba0f90b..0000000 --- a/src/components/Footer.scss +++ /dev/null @@ -1,34 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.footer { - display: grid; - grid-auto-flow: column; - justify-content: center; - column-gap: 5px; - font-size: 11px; - - * { - color: $font; - } - - .textButton { - margin: 0; - padding: 0; - } -} diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx deleted file mode 100644 index ca8dba5..0000000 --- a/src/components/Footer.tsx +++ /dev/null @@ -1,65 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useContext } from 'react'; - -import HSContext, { - HSOptions, - ActionType as HSACtionType, -} from '../contexts/HSContext'; -import ClientContext, { - ActionType as ClientActionType, -} from '../contexts/ClientContext'; -import TextButton from './TextButton'; - -import './Footer.scss'; - -const Footer: React.FC = () => { - const [hsState, hsDispatch] = useContext(HSContext); - const [clientState, clientDispatch] = useContext(ClientContext); - - const clear = - hsState.option !== HSOptions.Unset || clientState.clientId !== null ? ( - <> - {' · '} - { - hsDispatch({ - action: HSACtionType.Clear, - }); - clientDispatch({ - action: ClientActionType.ClearClient, - }); - }} - > - Clear preferences - - - ) : null; - - return ( -
    - GitHub project - {' · '} - - Add your app - - {clear} -
    - ); -}; - -export default Footer; diff --git a/src/components/GroupPreview.scss b/src/components/GroupPreview.scss deleted file mode 100644 index aae3aba..0000000 --- a/src/components/GroupPreview.scss +++ /dev/null @@ -1,26 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.groupPreview { - > .avatar { - margin-bottom: 8px; - } - - > h1 { - font-size: 24px; - margin-bottom: 4px; - } -} diff --git a/src/components/GroupPreview.tsx b/src/components/GroupPreview.tsx deleted file mode 100644 index 49a2c22..0000000 --- a/src/components/GroupPreview.tsx +++ /dev/null @@ -1,45 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import { Group } from '../matrix-cypher'; - -import { GroupAvatar } from './Avatar'; - -import './GroupPreview.scss'; - -interface IProps { - group: Group; - groupId: string; -} - -const GroupPreview: React.FC = ({ group, groupId }: IProps) => { - const description = group.long_description - ? group.long_description - : group.short_description - ? group.short_description - : null; - - return ( -
    - -

    {group.name}

    - {description ?

    {description}

    : null} -
    - ); -}; - -export default GroupPreview; diff --git a/src/components/HomeserverOptions.scss b/src/components/HomeserverOptions.scss deleted file mode 100644 index f0736c0..0000000 --- a/src/components/HomeserverOptions.scss +++ /dev/null @@ -1,57 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.homeserverOptions { - display: grid; - row-gap: 20px; - - background: $app-background; - text-align: left; - - > * { - width: 100%; - } - - .homeserverOptionsDescription { - width: 100%; - - display: flex; - flex-direction: row; - justify-content: space-between; - - > p { - flex-grow: 1; - } - - > img { - flex-shrink: 0; - flex-grow: 0; - background-color: $background; - height: 62px; - width: 62px; - padding: 11px; - border-radius: 100%; - margin-left: 14px; - } - } - - form { - display: grid; - row-gap: 25px; - } -} diff --git a/src/components/HomeserverOptions.stories.tsx b/src/components/HomeserverOptions.stories.tsx deleted file mode 100644 index b6e112e..0000000 --- a/src/components/HomeserverOptions.stories.tsx +++ /dev/null @@ -1,42 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import HomeserverOptions from './HomeserverOptions'; -import { LinkKind } from '../parser/types'; - -export default { - title: 'HomeserverOptions', - parameters: { - design: { - type: 'figma', - url: - 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853', - }, - }, -}; - -export const Default: React.FC = () => ( - -); diff --git a/src/components/HomeserverOptions.tsx b/src/components/HomeserverOptions.tsx deleted file mode 100644 index 750b1c0..0000000 --- a/src/components/HomeserverOptions.tsx +++ /dev/null @@ -1,130 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useContext, useState } from 'react'; -import { Formik, Form } from 'formik'; -import { string } from 'zod'; - -import Tile from './Tile'; -import HSContext, { TempHSContext, ActionType } from '../contexts/HSContext'; -import icon from '../imgs/telecom-mast.svg'; -import Button from './Button'; -import Input from './Input'; -import StyledCheckbox from './StyledCheckbox'; -import { SafeLink } from '../parser/types'; - -import './HomeserverOptions.scss'; - -interface IProps { - link: SafeLink; -} - -interface FormValues { - HSUrl: string; -} - -function validateURL(values: FormValues): Partial { - const errors: Partial = {}; - try { - string().url().parse(values.HSUrl); - } catch { - errors.HSUrl = - 'This must be a valid homeserver URL, starting with https://'; - } - return errors; -} - -const HomeserverOptions: React.FC = ({ link }: IProps) => { - const HSStateDispatcher = useContext(HSContext)[1]; - const TempHSStateDispatcher = useContext(TempHSContext)[1]; - - const [rememberSelection, setRemeberSelection] = useState(false); - - // Select which disaptcher to use based on whether we're writing - // the choice to localstorage - const dispatcher = rememberSelection - ? HSStateDispatcher - : TempHSStateDispatcher; - - const hsInput = ( - - dispatcher({ action: ActionType.SetHS, HSURL: HSUrl }) - } - > - {({ values, errors }): JSX.Element => ( -
    - - {values.HSUrl && !errors.HSUrl ? ( - - ) : null} -
    - )} -
    - ); - - return ( - -
    -
    -

    - About  - - {link.identifier} - -

    -

    - A homeserver will show you metadata about the link, like - a description. Homeservers will be able to relate your - IP to things you've opened invites for in matrix.to. -

    -
    - Icon making it clear that connections may be made with external services -
    - setRemeberSelection(e.target.checked)} - > - Remember my choice - - - {hsInput} -
    - ); -}; - -export default HomeserverOptions; diff --git a/src/components/Input.scss b/src/components/Input.scss deleted file mode 100644 index 8163678..0000000 --- a/src/components/Input.scss +++ /dev/null @@ -1,50 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; -@import '../error'; - -.input { - width: 100%; - padding: 12px; - - background: $background; - - border: 1px solid $foreground; - border-radius: 16px; - - font: lighten($grey, 60%); - font-size: 14px; - line-height: 24px; - - &.error { - @include error; - } - - &:focus { - border: 1px solid $font; - font: $font; - } -} - -.inputError { - @include error; - text-align: center; -} - -.inputMuted { - border-color: lighten($grey, 60%); -} diff --git a/src/components/Input.stories.tsx b/src/components/Input.stories.tsx deleted file mode 100644 index f45e5ab..0000000 --- a/src/components/Input.stories.tsx +++ /dev/null @@ -1,45 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import { withDesign } from 'storybook-addon-designs'; -import { Formik, Form } from 'formik'; - -import Input from './Input'; - -export default { - title: 'Input', - parameters: { - design: { - type: 'figma', - url: - 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1', - }, - }, - decorators: [withDesign], -}; - -export const Default: React.FC = () => ( - {}}> -
    - -
    -
    -); diff --git a/src/components/Input.tsx b/src/components/Input.tsx deleted file mode 100644 index 21ce342..0000000 --- a/src/components/Input.tsx +++ /dev/null @@ -1,50 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import classnames from 'classnames'; -import { useField } from 'formik'; - -import './Input.scss'; - -interface IProps extends React.InputHTMLAttributes { - name: string; - type: string; - muted?: boolean; -} - -const Input: React.FC = ({ className, muted, ...props }) => { - const [field, meta] = useField(props); - - const errorBool = meta.touched && meta.value !== '' && meta.error; - const error = errorBool ? ( -
    {meta.error}
    - ) : null; - - const classNames = classnames('input', className, { - error: errorBool, - inputMuted: !!muted, - }); - - return ( - <> - - {error} - - ); -}; - -export default Input; diff --git a/src/components/InviteTile.scss b/src/components/InviteTile.scss deleted file mode 100644 index f9a8cdd..0000000 --- a/src/components/InviteTile.scss +++ /dev/null @@ -1,39 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.inviteTile { - display: grid; - row-gap: 24px; - - .inviteTileClientSelection { - margin: 0 auto; - display: grid; - - justify-content: space-between; - row-gap: 20px; - - h2 + p { - color: $foreground; - } - } - - hr { - width: 100%; - margin: 0; - } -} diff --git a/src/components/InviteTile.stories.tsx b/src/components/InviteTile.stories.tsx deleted file mode 100644 index b92870c..0000000 --- a/src/components/InviteTile.stories.tsx +++ /dev/null @@ -1,123 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -// disable camelcase check because our object keys come -// from the matrix spec -/* eslint-disable @typescript-eslint/camelcase */ - -import React from 'react'; - -import InviteTile from './InviteTile'; -import UserPreview, { InviterPreview } from './UserPreview'; -import RoomPreview, { RoomPreviewWithTopic } from './RoomPreview'; -import Clients from '../clients'; -import { LinkKind, SafeLink } from '../parser/types'; - -export default { - title: 'InviteTile', - parameters: { - design: { - type: 'figma', - url: - 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A334', - }, - }, -}; - -const userLink: SafeLink = { - kind: LinkKind.UserId, - identifier: '@jorik:matrix.org', - arguments: { - vias: [], - originalParams: new URLSearchParams(), - }, - originalLink: 'asdfsadf', -}; - -const roomLink: SafeLink = { - kind: LinkKind.Alias, - identifier: '#element-dev:matrix.org', - arguments: { - vias: [], - originalParams: new URLSearchParams(), - }, - originalLink: 'asdfsadf', -}; - -export const withLink: React.FC<{}> = () => ( - - This is an invite with a link - -); - -export const withInstruction: React.FC<{}> = () => ( - - This is an invite with an instruction - -); - -export const withUserPreview: React.FC<{}> = () => ( - - - -); - -export const withRoomPreviewAndRoomTopic: React.FC<{}> = () => ( - - - -); - -export const withRoomPreviewAndInviter: React.FC<{}> = () => ( - - - - -); diff --git a/src/components/InviteTile.tsx b/src/components/InviteTile.tsx deleted file mode 100644 index 76e8ef4..0000000 --- a/src/components/InviteTile.tsx +++ /dev/null @@ -1,120 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useState } from 'react'; - -import './InviteTile.scss'; - -import Tile from './Tile'; -import LinkButton from './LinkButton'; -import Button from './Button'; -import ClientSelection from './ClientSelection'; -import { Client, ClientKind } from '../clients/types'; -import { SafeLink } from '../parser/types'; -import TextButton from './TextButton'; - -interface IProps { - children?: React.ReactNode; - client: Client | null; - link: SafeLink; -} - -const InviteTile: React.FC = ({ children, client, link }: IProps) => { - const [showAdvanced, setShowAdvanced] = useState(false); - let invite: React.ReactNode; - let advanced: React.ReactNode; - - if (client === null) { - invite = showAdvanced ? null : ( - - ); - } else { - let inviteUseString: string; - - switch (client.kind) { - case ClientKind.LINKED_CLIENT: - invite = ( - - Accept invite - - ); - inviteUseString = `Accepting will open this link in ${client.name}.`; - break; - case ClientKind.TEXT_CLIENT: - // TODO: copy to clipboard - invite =

    {client.toInviteString(link)}

    ; - navigator.clipboard?.writeText(client.copyString(link)); - inviteUseString = `These are instructions for ${client.name}.`; - break; - } - - const advancedButton = ( -

    - {inviteUseString} - setShowAdvanced(!showAdvanced)} - > - Change client - -

    - ); - - invite = ( - <> - {invite} - {advancedButton} - - ); - } - - if (showAdvanced) { - if (client === null) { - advanced = ( - <> -
    -

    Almost done!

    -

    Great, pick a client below to confirm and continue

    - - - ); - } else { - advanced = ( - <> -
    -

    Change app

    - - - ); - } - } - - advanced = advanced ? ( -
    {advanced}
    - ) : null; - return ( - <> - - {children} - {invite} - {advanced} - - - ); -}; - -export default InviteTile; diff --git a/src/components/InvitingClientTile.stories.tsx b/src/components/InvitingClientTile.stories.tsx deleted file mode 100644 index 6cac6ee..0000000 --- a/src/components/InvitingClientTile.stories.tsx +++ /dev/null @@ -1,23 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import ClientTile from './InvitingClientTile'; - -export default { title: 'ClientTile' }; - -export const Element = ; diff --git a/src/components/InvitingClientTile.tsx b/src/components/InvitingClientTile.tsx deleted file mode 100644 index 2d22a6c..0000000 --- a/src/components/InvitingClientTile.tsx +++ /dev/null @@ -1,58 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import Tile from './Tile'; - -import { clientMap } from '../clients'; -import './MatrixTile.scss'; - -interface IProps { - clientName: string; -} - -const InvitingClientTile: React.FC = ({ clientName }: IProps) => { - const client = clientMap[clientName]; - - if (!client) { - return ( - - {/* TODO: add gh link */} -

    - The client that created this link "{clientName}" is not a - recognised client. If this is a mistake and you'd like a - nice advertisement for it here please{' '} - - open a pr - - . -

    -
    - ); - } - - return ( - - {client.name} -

    - Invite created with {client.name} -

    -
    {client.description}
    -
    - ); -}; - -export default InvitingClientTile; diff --git a/src/components/LinkButton.tsx b/src/components/LinkButton.tsx deleted file mode 100644 index 375f926..0000000 --- a/src/components/LinkButton.tsx +++ /dev/null @@ -1,34 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import classnames from 'classnames'; - -import './Button.scss'; - -interface IProps extends React.LinkHTMLAttributes {} - -const LinkButton: React.FC = ({ - className, - children, - ...props -}: IProps) => ( - - {children} - -); - -export default LinkButton; diff --git a/src/components/LinkPreview.tsx b/src/components/LinkPreview.tsx deleted file mode 100644 index e5355ef..0000000 --- a/src/components/LinkPreview.tsx +++ /dev/null @@ -1,193 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React, { useState, useEffect, useContext } from 'react'; -import { getEvent, client } from '../matrix-cypher'; - -import { RoomPreviewWithTopic } from './RoomPreview'; -import InviteTile from './InviteTile'; -import { SafeLink, LinkKind } from '../parser/types'; -import UserPreview, { WrappedInviterPreview } from './UserPreview'; -import EventPreview from './EventPreview'; -import GroupPreview from './GroupPreview'; -import HomeserverOptions from './HomeserverOptions'; -import DefaultPreview from './DefaultPreview'; -import Details from './Details'; -import { clientMap } from '../clients'; -import { - getRoomFromId, - getRoomFromAlias, - getRoomFromPermalink, - getUser, - getGroup, -} from '../utils/cypher-wrapper'; -import { ClientContext } from '../contexts/ClientContext'; -import useHSs from '../utils/getHS'; - -interface IProps { - link: SafeLink; -} - -const invite = async ({ - clientAddress, - link, -}: { - clientAddress: string; - link: SafeLink; -}): Promise => { - // TODO: replace with client fetch - switch (link.kind) { - case LinkKind.Alias: - return ( - - ); - - case LinkKind.RoomId: - return ( - - ); - - case LinkKind.UserId: - return ( - - ); - - case LinkKind.Permalink: - return ( - - ); - - case LinkKind.GroupId: - return ( - - ); - - default: - // Todo Implement events - return <>; - } -}; - -interface PreviewProps extends IProps { - client: string; -} - -const Preview: React.FC = ({ link, client }: PreviewProps) => { - const [content, setContent] = useState(); - - // TODO: support multiple clients with vias - useEffect(() => { - (async (): Promise => - setContent( - await invite({ - clientAddress: client, - link, - }) - ))(); - }, [link, client]); - - return content; -}; - -const LinkPreview: React.FC = ({ link }: IProps) => { - let content: JSX.Element; - const [showHSOptions, setShowHSOPtions] = useState(false); - - const hses = useHSs({ link }); - - if (!hses.length) { - content = ( - <> - -
    setShowHSOPtions(!showHSOptions)} - > - - About  - - {link.identifier} - - -
    - - ); - if (showHSOptions) { - content = ( - <> - {content} - - - ); - } - } else { - content = ; - } - - const [{ clientId }] = useContext(ClientContext); - - // Select which client to link to - const displayClientId = clientId - ? clientId - : link.arguments.client - ? link.arguments.client - : null; - - const client = displayClientId ? clientMap[displayClientId] : null; - - const sharer = link.arguments.sharer ? ( - - ) : ( -

    You're invited to join

    - ); - - return ( - - {sharer} - {content} - - ); -}; - -export default LinkPreview; diff --git a/src/components/MatrixTile.scss b/src/components/MatrixTile.scss deleted file mode 100644 index 6c8f17b..0000000 --- a/src/components/MatrixTile.scss +++ /dev/null @@ -1,24 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.matrixTile { - background: none; - box-shadow: none; - row-gap: 16px; - padding: 0 40px; - justify-items: left; - text-align: left; -} diff --git a/src/components/MatrixTile.stories.tsx b/src/components/MatrixTile.stories.tsx deleted file mode 100644 index 9bc3233..0000000 --- a/src/components/MatrixTile.stories.tsx +++ /dev/null @@ -1,23 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import MatrixTile from './MatrixTile'; - -export default { title: 'MatrixTile' }; - -export const Default: React.FC = () => ; diff --git a/src/components/MatrixTile.tsx b/src/components/MatrixTile.tsx deleted file mode 100644 index 9808a09..0000000 --- a/src/components/MatrixTile.tsx +++ /dev/null @@ -1,53 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import Tile from './Tile'; -import Footer from './Footer'; - -import logo from '../imgs/matrix-logo.svg'; - -import './MatrixTile.scss'; - -interface IProps { - isLink?: boolean; -} - -const MatrixTile: React.FC = ({ isLink }: IProps) => { - const copy = isLink ? ( -
    - This invite uses Matrix, an open - network for secure, decentralized communication. -
    - ) : ( -
    - Matrix.to is a stateless URL redirecting service for the{' '} - Matrix ecosystem. -
    - ); - - return ( -
    - - matrix-logo - {copy} -
    - -
    - ); -}; - -export default MatrixTile; diff --git a/src/components/RoomPreview.scss b/src/components/RoomPreview.scss deleted file mode 100644 index b7e7b36..0000000 --- a/src/components/RoomPreview.scss +++ /dev/null @@ -1,30 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.roomPreview { - > .avatar { - margin-bottom: 8px; - } - - > h1 { - font-size: 24px; - margin-bottom: 4px; - } -} - -.roomTopic { - padding-top: 8px; -} diff --git a/src/components/RoomPreview.tsx b/src/components/RoomPreview.tsx deleted file mode 100644 index 620874a..0000000 --- a/src/components/RoomPreview.tsx +++ /dev/null @@ -1,60 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import { Room } from '../matrix-cypher'; - -import { RoomAvatar } from './Avatar'; - -import './RoomPreview.scss'; - -interface IProps { - room: Room; -} - -const RoomPreview: React.FC = ({ room }: IProps) => { - const roomAlias = room.canonical_alias - ? room.canonical_alias - : room.aliases - ? room.aliases[0] - : room.room_id; - const members = - room.num_joined_members > 0 ? ( -

    {room.num_joined_members.toLocaleString()} members

    - ) : null; - return ( -
    - -

    - {room.name ? room.name : roomAlias} -

    - {members} -

    {roomAlias}

    -
    - ); -}; - -export const RoomPreviewWithTopic: React.FC = ({ room }: IProps) => { - const topic = room.topic ?

    {room.topic}

    : null; - return ( - <> - - {topic} - - ); -}; - -export default RoomPreview; diff --git a/src/components/StyledCheckbox.scss b/src/components/StyledCheckbox.scss deleted file mode 100644 index 011e53f..0000000 --- a/src/components/StyledCheckbox.scss +++ /dev/null @@ -1,59 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; -@import '../mixins'; - -.styledCheckbox { - display: flex; - - align-items: center; - - input[type='checkbox'] { - display: none; - - &:checked + div { - background: $foreground; - img { - display: block; - } - } - - &.focus-visible { - & + div { - @include unreal-focus; - } - } - } - - .styledCheckboxWrapper { - display: flex; - - margin-right: 5px; - border: 2px solid $foreground; - box-sizing: border-box; - border-radius: 4px; - height: 16px; - width: 16px; - - img { - height: 100%; - width: 100%; - - display: none; - } - } -} diff --git a/src/components/StyledCheckbox.tsx b/src/components/StyledCheckbox.tsx deleted file mode 100644 index 9450f4e..0000000 --- a/src/components/StyledCheckbox.tsx +++ /dev/null @@ -1,41 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - http://www.apache.org/licenses/LICENSE-2.0 -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -/* - * Stolen from the matrix-react-sdk - */ - -import React from 'react'; - -import tick from '../imgs/tick.svg'; - -import './StyledCheckbox.scss'; - -interface IProps extends React.InputHTMLAttributes {} - -const StyledCheckbox: React.FC = ({ - children, - className, - ...otherProps -}: IProps) => ( - -); - -export default StyledCheckbox; diff --git a/src/components/TextButton.scss b/src/components/TextButton.scss deleted file mode 100644 index cdaed54..0000000 --- a/src/components/TextButton.scss +++ /dev/null @@ -1,31 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -@import '../color-scheme'; - -.textButton { - background: none; - border: none; - color: $link; - font-style: normal; - font-weight: normal; - font-size: 14px; - line-height: 24px; - - &:hover { - cursor: pointer; - } -} diff --git a/src/components/TextButton.stories.tsx b/src/components/TextButton.stories.tsx deleted file mode 100644 index 2c95dc2..0000000 --- a/src/components/TextButton.stories.tsx +++ /dev/null @@ -1,34 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import TextButton from './TextButton'; - -export default { - title: 'TextButton', - parameters: { - design: { - type: 'figma', - url: - 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=149%3A10756', - }, - }, -}; - -export const Default: React.FC = () => ( - This is a button? -); diff --git a/src/components/TextButton.tsx b/src/components/TextButton.tsx deleted file mode 100644 index 6c9cfc5..0000000 --- a/src/components/TextButton.tsx +++ /dev/null @@ -1,30 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; -import classnames from 'classnames'; - -import './TextButton.scss'; - -const TextButton: React.FC> = ({ - className, - ...props -}) => { - return ( -