diff --git a/package.json b/package.json index 32e11865450a9ddaa4dd4ac37fd52b8ffa36c4f2..b4af7abfb8ec3907553a368e1410a9ea0cc7ebcc 100644 --- a/package.json +++ b/package.json @@ -23,11 +23,11 @@ "lint-staged": { "src/**/*.{js,jsx,ts,tsx}": [ "eslint --fix", - "prettier --write --tab-width 4", + "prettier --write --tab-width 4 --single-quote", "git add" ], "src/**/*.{json,css,scss,md}": [ - "prettier --write --tab-width 4", + "prettier --write --tab-width 4 --single-quote", "git add" ] }, diff --git a/src/clients/Element.io.ts b/src/clients/Element.io.ts index 015c31de20f2dd9c6e297a9a27da22340a64b8a7..402f97f53e57ed7d87c14e1ba5f96660a8cdea1e 100644 --- a/src/clients/Element.io.ts +++ b/src/clients/Element.io.ts @@ -14,18 +14,18 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { LinkedClient, Maturity, ClientKind } from "./types"; -import { LinkKind } from "../parser/types"; -import logo from "./element.svg"; +import { LinkedClient, Maturity, ClientKind } from './types'; +import { LinkKind } from '../parser/types'; +import logo from './element.svg'; const Element: LinkedClient = { kind: ClientKind.LINKED_CLIENT, - name: "Element", - author: "Element", + name: 'Element', + author: 'Element', logo: logo, - homepage: "https://element.io", + homepage: 'https://element.io', maturity: Maturity.STABLE, - description: "Fully-featured Matrix client for the Web", + description: 'Fully-featured Matrix client for the Web', tags: [], toUrl: (link) => { switch (link.kind) { diff --git a/src/clients/index.ts b/src/clients/index.ts index ac677553f1eb7827e1e260b06f0d0a25d1dc0157..0fc102f3505dab3409f636017bc749ebb1b2c513 100644 --- a/src/clients/index.ts +++ b/src/clients/index.ts @@ -14,9 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { Client } from "./types"; +import { Client } from './types'; -import Element from "./Element.io"; +import Element from './Element.io'; /* * All the supported clients of matrix.to diff --git a/src/clients/types.ts b/src/clients/types.ts index 4d21ac4522ad9cfa5f98d9c9f3c131b04c4b11c8..8daea917538390829773df441555a0b2fa719103 100644 --- a/src/clients/types.ts +++ b/src/clients/types.ts @@ -14,35 +14,35 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { SafeLink } from "../parser/types"; +import { SafeLink } from '../parser/types'; /* * A collection of descriptive tags that can be added to * a clients description. */ export enum Tag { - IOS = "IOS", - ANDROID = "ANDROID", - DESKTOP = "DESKTOP", + 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", + 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", + LINKED_CLIENT = 'LINKED_CLIENT', + TEXT_CLIENT = 'TEXT_CLIENT', } /* diff --git a/src/components/Avatar.stories.tsx b/src/components/Avatar.stories.tsx index 2a8de363c44da2ae68b0caa7cde707e2ab7fe54f..1032c18c5c52e11aabadaff9479a3d60efd7506a 100644 --- a/src/components/Avatar.stories.tsx +++ b/src/components/Avatar.stories.tsx @@ -14,17 +14,21 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +// disable camelcase check because our object keys come +// from the matrix spec +/* eslint-disable @typescript-eslint/camelcase */ -import { UserAvatar } from "./Avatar"; +import React from 'react'; + +import { UserAvatar } from './Avatar'; export default { - title: "Avatar", + title: 'Avatar', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://www.figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853", + 'https://www.figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853', }, }, }; @@ -32,8 +36,8 @@ export default { export const Default: React.FC<{}> = () => ( <UserAvatar user={{ - avatar_url: "mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf", - displayname: "Jorik Schellekens", + avatar_url: 'mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf', + displayname: 'Jorik Schellekens', }} userId="@jorik:matrix.org" /> diff --git a/src/components/Avatar.tsx b/src/components/Avatar.tsx index a3de53b723c76dd3b2b352468cf266342a6c3891..003d004dc1db62992fbdae68b2d8da73a0ade525 100644 --- a/src/components/Avatar.tsx +++ b/src/components/Avatar.tsx @@ -14,14 +14,14 @@ 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 { Room, User } from "matrix-cypher"; +import React, { useEffect, useState } from 'react'; +import classNames from 'classnames'; +import { Room, User } from 'matrix-cypher'; -import { getMediaQueryFromMCX } from "../utils/cypher-wrapper"; -import logo from "../imgs/matrix-logo.svg"; +import { getMediaQueryFromMCX } from '../utils/cypher-wrapper'; +import logo from '../imgs/matrix-logo.svg'; -import "./Avatar.scss"; +import './Avatar.scss'; interface IProps { className?: string; @@ -40,7 +40,7 @@ const Avatar: React.FC<IProps> = ({ className, avatarUrl, label }: IProps) => { src={src} onError={(): void => setSrc(logo)} alt={label} - className={classNames("avatar", className)} + className={classNames('avatar', className)} /> ); }; diff --git a/src/components/Button.stories.tsx b/src/components/Button.stories.tsx index 2514b6de39276967271c0fa85d986637a5be778a..1f5d2e591e35df3ec8e0650e0804d8e922a098d3 100644 --- a/src/components/Button.stories.tsx +++ b/src/components/Button.stories.tsx @@ -14,16 +14,16 @@ 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 React from 'react'; +import { action } from '@storybook/addon-actions'; +import { text } from '@storybook/addon-knobs'; -import Button from "./Button"; +import Button from './Button'; -export default { title: "Button" }; +export default { title: 'Button' }; export const WithText: React.FC = () => ( - <Button onClick={action("clicked")}> - {text("label", "Hello Story Book")} + <Button onClick={action('clicked')}> + {text('label', 'Hello Story Book')} </Button> ); diff --git a/src/components/Button.tsx b/src/components/Button.tsx index 420bf0b9cdba6255316f0d97a37dccb682cbf20e..a347254ccb1791316ca012cc91efb53efb0ea53d 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -14,10 +14,10 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import classnames from "classnames"; +import React from 'react'; +import classnames from 'classnames'; -import "./Button.scss"; +import './Button.scss'; interface IProps extends React.ButtonHTMLAttributes<Element> { // Briefly display these instead of the children onClick @@ -49,7 +49,7 @@ const Button: React.FC< const content = wasClicked && flashChildren ? flashChildren : children; - const classNames = classnames("button", className, { + const classNames = classnames('button', className, { buttonHighlight: wasClicked, }); diff --git a/src/components/CreateLinkTile.stories.tsx b/src/components/CreateLinkTile.stories.tsx index f247506a19f8359b8336a14f58d1f0b7aeb6677a..48d7e5c275f85f7d85f2695d84d110eb7a4caa26 100644 --- a/src/components/CreateLinkTile.stories.tsx +++ b/src/components/CreateLinkTile.stories.tsx @@ -14,17 +14,17 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import CreateLinkTile from "./CreateLinkTile"; +import CreateLinkTile from './CreateLinkTile'; export default { - title: "CreateLinkTile", + title: 'CreateLinkTile', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1", + 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1', }, }, }; diff --git a/src/components/CreateLinkTile.tsx b/src/components/CreateLinkTile.tsx index 4d557e705dcef40a1f91faf548dee9b51e8c2228..63a57d32cf20b3634d9bc40fade2ea3e25636019 100644 --- a/src/components/CreateLinkTile.tsx +++ b/src/components/CreateLinkTile.tsx @@ -14,15 +14,15 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React, { useEffect, useRef } from "react"; -import Tile from "./Tile"; -import Button from "./Button"; -import TextButton from "./TextButton"; -import Input from "./Input"; -import { Formik, Form } from "formik"; -import * as Yup from "yup"; +import React, { useEffect, useRef } from 'react'; +import Tile from './Tile'; +import Button from './Button'; +import TextButton from './TextButton'; +import Input from './Input'; +import { Formik, Form } from 'formik'; +import * as Yup from 'yup'; -import "./CreateLinkTile.scss"; +import './CreateLinkTile.scss'; interface ILinkNotCreatedTileProps { setLink: React.Dispatch<React.SetStateAction<string>>; @@ -39,31 +39,31 @@ const LinkNotCreatedTile: React.FC<ILinkNotCreatedTileProps> = ( </h1> <Formik initialValues={{ - identifier: "", + identifier: '', }} validationSchema={Yup.object({ identifier: Yup.string() .test( - "is-identifier", + 'is-identifier', "That link doesn't look right. Double check the details.", (link) => link ) - .required("Required"), + .required('Required'), })} onSubmit={(values): void => { props.setLink( document.location.protocol + - "//" + + '//' + document.location.host + - "/" + + '/' + values.identifier ); }} > <Form> <Input - name={"identifier"} - type={"text"} + name={'identifier'} + type={'text'} placeholder="#room:example.com, @user:example.com" /> <Button type="submit">Get Link</Button> @@ -90,12 +90,12 @@ const LinkCreatedTile: React.FC<ILinkCreatedTileProps> = (props) => { return ( <Tile className="createLinkTile"> - <TextButton onClick={(): void => props.setLink("")}> + <TextButton onClick={(): void => props.setLink('')}> Create another lnk </TextButton> <h1>{props.link}</h1> <Button - flashChildren={"Copied"} + flashChildren={'Copied'} onClick={(): void => { navigator.clipboard.writeText(props.link); }} @@ -108,7 +108,7 @@ const LinkCreatedTile: React.FC<ILinkCreatedTileProps> = (props) => { }; const CreateLinkTile: React.FC = () => { - const [link, setLink] = React.useState(""); + const [link, setLink] = React.useState(''); console.log(link); if (!link) { return <LinkNotCreatedTile setLink={setLink} />; diff --git a/src/components/EventPreview.tsx b/src/components/EventPreview.tsx index 9f818002e63257f44662e2d22f6c34b8398f49b9..de7ac7f019c63b10a3a7ea75bd761e56d829730f 100644 --- a/src/components/EventPreview.tsx +++ b/src/components/EventPreview.tsx @@ -14,10 +14,10 @@ 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 React from 'react'; +import { Room, Event } from 'matrix-cypher'; -import RoomPreview from "./RoomPreview"; +import RoomPreview from './RoomPreview'; interface IProps { room: Room; diff --git a/src/components/Input.stories.tsx b/src/components/Input.stories.tsx index 27db8522db3f5205f9046a0ffd864ea963baaa81..f45e5abc470d402bb12eb61f80b68d71c7926425 100644 --- a/src/components/Input.stories.tsx +++ b/src/components/Input.stories.tsx @@ -14,19 +14,19 @@ 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 React from 'react'; +import { withDesign } from 'storybook-addon-designs'; +import { Formik, Form } from 'formik'; -import Input from "./Input"; +import Input from './Input'; export default { - title: "Input", + title: 'Input', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1", + 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A1', }, }, decorators: [withDesign], diff --git a/src/components/Input.tsx b/src/components/Input.tsx index f1217f1c100d003b9781d889f6035b1b8c199cec..7a50385cc278195a9ffed62ef034253e3b2f4149 100644 --- a/src/components/Input.tsx +++ b/src/components/Input.tsx @@ -14,11 +14,11 @@ 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 React from 'react'; +import classnames from 'classnames'; +import { useField } from 'formik'; -import "./Input.scss"; +import './Input.scss'; interface IProps extends React.InputHTMLAttributes<Element> { name: string; @@ -33,7 +33,7 @@ const Input: React.FC<IProps> = ({ className, ...props }) => { <div className="inputError">{meta.error}</div> ) : null; - const classNames = classnames("input", className, { + const classNames = classnames('input', className, { error: meta.error, }); diff --git a/src/components/InviteTile.stories.tsx b/src/components/InviteTile.stories.tsx index f083edac3430e6e8532657a46a3a8be21f11c1bf..997982c1f6e121df75f7312a3fc7c94e5fb41e1a 100644 --- a/src/components/InviteTile.stories.tsx +++ b/src/components/InviteTile.stories.tsx @@ -14,41 +14,45 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +// disable camelcase check because our object keys come +// from the matrix spec +/* eslint-disable @typescript-eslint/camelcase */ -import InviteTile from "./InviteTile"; -import UserPreview, { InviterPreview } from "./UserPreview"; -import RoomPreview, { RoomPreviewWithTopic } from "./RoomPreview"; -import Clients from "../clients"; -import { LinkKind, SafeLink } from "../parser/types"; +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", + title: 'InviteTile', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A334", + 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=59%3A334', }, }, }; const userLink: SafeLink = { kind: LinkKind.UserId, - identifier: "@jorik:matrix.org", + identifier: '@jorik:matrix.org', arguments: { vias: [], }, - originalLink: "asdfsadf", + originalLink: 'asdfsadf', }; const roomLink: SafeLink = { kind: LinkKind.Alias, - identifier: "#element-dev:matrix.org", + identifier: '#element-dev:matrix.org', arguments: { vias: [], }, - originalLink: "asdfsadf", + originalLink: 'asdfsadf', }; export const withLink: React.FC<{}> = () => ( @@ -67,8 +71,8 @@ export const withUserPreview: React.FC<{}> = () => ( <InviteTile client={Clients[0]} link={userLink}> <UserPreview user={{ - avatar_url: "mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf", - displayname: "Nicholas Briteli", + avatar_url: 'mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf', + displayname: 'Nicholas Briteli', }} userId="@nicholasbritelli:matrix.org" /> @@ -79,13 +83,13 @@ export const withRoomPreviewAndRoomTopic: React.FC<{}> = () => ( <InviteTile client={Clients[0]} link={roomLink}> <RoomPreviewWithTopic room={{ - aliases: ["#murrays:cheese.bar"], - avatar_url: "mxc://bleeker.street/CHEDDARandBRIE", + aliases: ['#murrays:cheese.bar'], + avatar_url: 'mxc://bleeker.street/CHEDDARandBRIE', guest_can_join: false, - name: "CHEESE", + name: 'CHEESE', num_joined_members: 37, - room_id: "!ol19s:bleecker.street", - topic: "Tasty tasty cheese", + room_id: '!ol19s:bleecker.street', + topic: 'Tasty tasty cheese', world_readable: true, }} /> @@ -96,20 +100,20 @@ export const withRoomPreviewAndInviter: React.FC<{}> = () => ( <InviteTile client={Clients[0]} link={roomLink}> <InviterPreview user={{ - avatar_url: "mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf", - displayname: "Nicholas Briteli", + avatar_url: 'mxc://matrix.org/EqMZYbAYhREvHXvYFyfxOlkf', + displayname: 'Nicholas Briteli', }} userId="@nicholasbritelli:matrix.org" /> <RoomPreview room={{ - aliases: ["#murrays:cheese.bar"], - avatar_url: "mxc://bleeker.street/CHEDDARandBRIE", + aliases: ['#murrays:cheese.bar'], + avatar_url: 'mxc://bleeker.street/CHEDDARandBRIE', guest_can_join: false, - name: "CHEESE", + name: 'CHEESE', num_joined_members: 37, - room_id: "!ol19s:bleecker.street", - topic: "Tasty tasty cheese", + room_id: '!ol19s:bleecker.street', + topic: 'Tasty tasty cheese', world_readable: true, }} /> diff --git a/src/components/InviteTile.tsx b/src/components/InviteTile.tsx index a659833ad4f067e3d8a2611634b5ac1a9a23d1b1..bf200fc62216ffea521085b684ed0c768dd2571a 100644 --- a/src/components/InviteTile.tsx +++ b/src/components/InviteTile.tsx @@ -14,15 +14,15 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import "./InviteTile.scss"; +import './InviteTile.scss'; -import Tile from "./Tile"; -import LinkButton from "./LinkButton"; -import TextButton from "./TextButton"; -import { Client, ClientKind } from "../clients/types"; -import { SafeLink } from "../parser/types"; +import Tile from './Tile'; +import LinkButton from './LinkButton'; +import TextButton from './TextButton'; +import { Client, ClientKind } from '../clients/types'; +import { SafeLink } from '../parser/types'; interface IProps { children?: React.ReactNode; diff --git a/src/components/LinkButton.tsx b/src/components/LinkButton.tsx index bd98d733b844357d1e91d5f4180e3f079b75b49a..ebada6db1927c2ce6e391d0d25135c88911294e4 100644 --- a/src/components/LinkButton.tsx +++ b/src/components/LinkButton.tsx @@ -14,15 +14,15 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import classnames from "classnames"; +import React from 'react'; +import classnames from 'classnames'; -import "./Button.scss"; +import './Button.scss'; interface IProps extends React.LinkHTMLAttributes<HTMLElement> {} const LinkButton: React.FC<IProps> = ({ className, ...props }: IProps) => ( - <a className={classnames("button", className)} {...props} /> + <a className={classnames('button', className)} {...props} /> ); export default LinkButton; diff --git a/src/components/LinkPreview.tsx b/src/components/LinkPreview.tsx index 2f78c7651c959bc6a5764f2de62592047e231984..9df012bd3c952ef6ff79473dac7a14465e0e5da3 100644 --- a/src/components/LinkPreview.tsx +++ b/src/components/LinkPreview.tsx @@ -14,21 +14,21 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React, { useState, useEffect } from "react"; -import { getEvent, client } from "matrix-cypher"; - -import { RoomPreviewWithTopic } from "./RoomPreview"; -import InviteTile from "./InviteTile"; -import { SafeLink, LinkKind } from "../parser/types"; -import UserPreview from "./UserPreview"; -import EventPreview from "./EventPreview"; -import Clients from "../clients"; +import React, { useState, useEffect } from 'react'; +import { getEvent, client } from 'matrix-cypher'; + +import { RoomPreviewWithTopic } from './RoomPreview'; +import InviteTile from './InviteTile'; +import { SafeLink, LinkKind } from '../parser/types'; +import UserPreview from './UserPreview'; +import EventPreview from './EventPreview'; +import Clients from '../clients'; import { getRoomFromId, getRoomFromAlias, getRoomFromPermalink, getUser, -} from "../utils/cypher-wrapper"; +} from '../utils/cypher-wrapper'; interface IProps { link: SafeLink; @@ -38,7 +38,7 @@ const LOADING: JSX.Element = <>Generating invite</>; const invite = async ({ link }: { link: SafeLink }): Promise<JSX.Element> => { // TODO: replace with client fetch - const defaultClient = await client("https://matrix.org"); + const defaultClient = await client('https://matrix.org'); switch (link.kind) { case LinkKind.Alias: return ( diff --git a/src/components/MatrixTile.stories.tsx b/src/components/MatrixTile.stories.tsx index 7755768aad2c0e16d6d352a1f2fb0657797b0fa6..9bc323342858aedd251c49a75229049efdf35c5c 100644 --- a/src/components/MatrixTile.stories.tsx +++ b/src/components/MatrixTile.stories.tsx @@ -14,10 +14,10 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import MatrixTile from "./MatrixTile"; +import MatrixTile from './MatrixTile'; -export default { title: "MatrixTile" }; +export default { title: 'MatrixTile' }; export const Default: React.FC = () => <MatrixTile />; diff --git a/src/components/MatrixTile.tsx b/src/components/MatrixTile.tsx index d76d0eb4b3c4faf1dcc9b2d834de0182f977e645..ee7ebaa7172dbde07dede5ef6fd4c4250342ecc6 100644 --- a/src/components/MatrixTile.tsx +++ b/src/components/MatrixTile.tsx @@ -14,12 +14,12 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import Tile from "./Tile"; +import React from 'react'; +import Tile from './Tile'; -import logo from "../imgs/matrix-logo.svg"; +import logo from '../imgs/matrix-logo.svg'; -import "./MatrixTile.scss"; +import './MatrixTile.scss'; const MatrixTile: React.FC = () => { return ( diff --git a/src/components/RoomPreview.tsx b/src/components/RoomPreview.tsx index 8e266bfe64dca9bd138185091971bbf7ca1d466b..a5a6225f0b51e9cc766d072965d58e03fb9585a0 100644 --- a/src/components/RoomPreview.tsx +++ b/src/components/RoomPreview.tsx @@ -14,12 +14,12 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import { Room } from "matrix-cypher"; +import React from 'react'; +import { Room } from 'matrix-cypher'; -import { RoomAvatar } from "./Avatar"; +import { RoomAvatar } from './Avatar'; -import "./RoomPreview.scss"; +import './RoomPreview.scss'; interface IProps { room: Room; diff --git a/src/components/TextButton.stories.tsx b/src/components/TextButton.stories.tsx index f81144d14e5d79ab7fc2a4754721908e6070c5db..2c95dc2bded70d1582d3d4f6b789316e66cf7b59 100644 --- a/src/components/TextButton.stories.tsx +++ b/src/components/TextButton.stories.tsx @@ -14,17 +14,17 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import TextButton from "./TextButton"; +import TextButton from './TextButton'; export default { - title: "TextButton", + title: 'TextButton', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=149%3A10756", + 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=149%3A10756', }, }, }; diff --git a/src/components/TextButton.tsx b/src/components/TextButton.tsx index 9ba01a76b9cff60e251a5eb395faa533cfd2b0c9..6c9cfc5bf6f8f171181a423a007b7020f6941603 100644 --- a/src/components/TextButton.tsx +++ b/src/components/TextButton.tsx @@ -14,17 +14,17 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import classnames from "classnames"; +import React from 'react'; +import classnames from 'classnames'; -import "./TextButton.scss"; +import './TextButton.scss'; const TextButton: React.FC<React.ButtonHTMLAttributes<Element>> = ({ className, ...props }) => { return ( - <button className={classnames("textButton", className)} {...props} /> + <button className={classnames('textButton', className)} {...props} /> ); }; export default TextButton; diff --git a/src/components/Tile.stories.tsx b/src/components/Tile.stories.tsx index a779e98b8390777f31327f10664c074b790a81cc..0cb2d87c2279f1da13158964d4e23dcbf7c151fd 100644 --- a/src/components/Tile.stories.tsx +++ b/src/components/Tile.stories.tsx @@ -14,17 +14,17 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import Tile from "./Tile"; +import Tile from './Tile'; export default { - title: "Tile", + title: 'Tile', parameters: { design: { - type: "figma", + type: 'figma', url: - "https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853", + 'https://figma.com/file/WSXjCGc1k6FVI093qhlzOP/04-Recieving-share-link?node-id=143%3A5853', }, }, }; diff --git a/src/components/Tile.tsx b/src/components/Tile.tsx index 9066f7669c3c98945314d3671d67a9063c72bf48..79f62492662a7796b8ce59561add80b42e9b7183 100644 --- a/src/components/Tile.tsx +++ b/src/components/Tile.tsx @@ -14,10 +14,10 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import classnames from "classnames"; +import React from 'react'; +import classnames from 'classnames'; -import "./Tile.scss"; +import './Tile.scss'; interface IProps { className?: string; @@ -26,7 +26,7 @@ interface IProps { const Tile: React.FC<IProps> = (props: IProps) => { return ( - <div className={classnames("tile", props.className)}> + <div className={classnames('tile', props.className)}> {props.children} </div> ); diff --git a/src/components/UserPreview.tsx b/src/components/UserPreview.tsx index 04339d824c2404bf410ee97851e76a85a774bd76..415b2a226c25eaf4a4d1259611a21e840e329234 100644 --- a/src/components/UserPreview.tsx +++ b/src/components/UserPreview.tsx @@ -14,12 +14,12 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; -import { User } from "matrix-cypher"; +import React from 'react'; +import { User } from 'matrix-cypher'; -import { UserAvatar } from "./Avatar"; +import { UserAvatar } from './Avatar'; -import "./UserPreview.scss"; +import './UserPreview.scss'; interface IProps { user: User; diff --git a/src/contexts/ClientContext.ts b/src/contexts/ClientContext.ts index 95cb97ea965394a84af7a834112312c9e9baca47..cb530cec2570d61ba936f09f9eb3b022e510cb99 100644 --- a/src/contexts/ClientContext.ts +++ b/src/contexts/ClientContext.ts @@ -14,9 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import { prefixFetch, Client, discoverServer } from "matrix-cypher"; +import { prefixFetch, Client, discoverServer } from 'matrix-cypher'; type State = { clientURL: string; @@ -25,8 +25,8 @@ type State = { // Actions are a discriminated union. export enum ActionTypes { - AddClient = "ADD_CLIENT", - RemoveClient = "REMOVE_CLIENT", + AddClient = 'ADD_CLIENT', + RemoveClient = 'REMOVE_CLIENT', } export interface AddClient { diff --git a/src/layouts/SingleColumn.tsx b/src/layouts/SingleColumn.tsx index bacc1e6eb46c207e352c7355e6aae51d46179cd0..ae2134ed617ad4cb91baf67974ffcf516527ebb6 100644 --- a/src/layouts/SingleColumn.tsx +++ b/src/layouts/SingleColumn.tsx @@ -14,9 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import "./SingleColumn.scss"; +import './SingleColumn.scss'; interface IProps { children?: React.ReactNode; diff --git a/src/pages/LinkRouter.tsx b/src/pages/LinkRouter.tsx index 827ff8f4e60186262c97b2ee5721bd34d06ea2f0..fe4a2a124c9c795a1741ce781654ec8107eb32e3 100644 --- a/src/pages/LinkRouter.tsx +++ b/src/pages/LinkRouter.tsx @@ -14,12 +14,12 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from "react"; +import React from 'react'; -import Tile from "../components/Tile"; -import LinkPreview from "../components/LinkPreview"; -import { parseHash } from "../parser/parser"; -import { LinkKind } from "../parser/types"; +import Tile from '../components/Tile'; +import LinkPreview from '../components/LinkPreview'; +import { parseHash } from '../parser/parser'; +import { LinkKind } from '../parser/types'; interface IProps { link: string; diff --git a/src/parser/parser.test.ts b/src/parser/parser.test.ts index 758dce2716fa2af98cff7b63f2abfc14784a011a..6086736f17f4e17355b224c5a23f08d70b68e905 100644 --- a/src/parser/parser.test.ts +++ b/src/parser/parser.test.ts @@ -7,57 +7,57 @@ import { verifiers, identifyTypeFromRegex, toURL, -} from "./parser"; +} from './parser'; -import { LinkKind } from "./types"; +import { LinkKind } from './types'; const identifierType = (id: string): LinkKind => identifyTypeFromRegex(id, verifiers, LinkKind.ParseFailed); -it("types identifiers correctly", () => { - expect(identifierType("@user:matrix.org")).toEqual(LinkKind.UserId); - expect(identifierType("!room:matrix.org")).toEqual(LinkKind.RoomId); - expect(identifierType("!somewhere:example.org/$event:example.org")).toEqual( +it('types identifiers correctly', () => { + expect(identifierType('@user:matrix.org')).toEqual(LinkKind.UserId); + expect(identifierType('!room:matrix.org')).toEqual(LinkKind.RoomId); + expect(identifierType('!somewhere:example.org/$event:example.org')).toEqual( LinkKind.Permalink ); - expect(identifierType("+group:matrix.org")).toEqual(LinkKind.GroupId); - expect(identifierType("#alias:matrix.org")).toEqual(LinkKind.Alias); + expect(identifierType('+group:matrix.org')).toEqual(LinkKind.GroupId); + expect(identifierType('#alias:matrix.org')).toEqual(LinkKind.Alias); }); -it("types garbage as such", () => { - expect(identifierType("sdfa;fdlkja")).toEqual(LinkKind.ParseFailed); - expect(identifierType("$event$matrix.org")).toEqual(LinkKind.ParseFailed); - expect(identifierType("/user:matrix.org")).toEqual(LinkKind.ParseFailed); +it('types garbage as such', () => { + expect(identifierType('sdfa;fdlkja')).toEqual(LinkKind.ParseFailed); + expect(identifierType('$event$matrix.org')).toEqual(LinkKind.ParseFailed); + expect(identifierType('/user:matrix.org')).toEqual(LinkKind.ParseFailed); }); -it("parses args correctly", () => { +it('parses args correctly', () => { expect( - parseArgs("via=example.org&via=alt.example.org") - ).toHaveProperty("vias", ["example.org", "alt.example.org"]); - expect(parseArgs("sharer=blah")).toHaveProperty("sharer", "blah"); - expect(parseArgs("client=blah.com")).toHaveProperty("client", "blah.com"); + parseArgs('via=example.org&via=alt.example.org') + ).toHaveProperty('vias', ['example.org', 'alt.example.org']); + expect(parseArgs('sharer=blah')).toHaveProperty('sharer', 'blah'); + expect(parseArgs('client=blah.com')).toHaveProperty('client', 'blah.com'); }); -it("parses permalinks", () => { - expect(parsePermalink("!somewhere:example.org/$event:example.org")).toEqual( +it('parses permalinks', () => { + expect(parsePermalink('!somewhere:example.org/$event:example.org')).toEqual( { roomKind: LinkKind.RoomId, - roomLink: "!somewhere:example.org", - eventId: "$event:example.org", + roomLink: '!somewhere:example.org', + eventId: '$event:example.org', } ); }); -it("formats links correctly", () => { +it('formats links correctly', () => { const bigLink = - "!somewhere:example.org/$event:example.org?via=dfasdf&via=jfjafjaf"; - const origin = "https://matrix.org"; - const prefix = origin + "/#/"; + '!somewhere:example.org/$event:example.org?via=dfasdf&via=jfjafjaf'; + const origin = 'https://matrix.org'; + const prefix = origin + '/#/'; const parse = parseHash(bigLink); switch (parse.kind) { case LinkKind.ParseFailed: - fail("Parse failed"); + fail('Parse failed'); default: expect(toURL(origin, parse).toString()).toEqual(prefix + bigLink); } diff --git a/src/parser/parser.ts b/src/parser/parser.ts index 0eb01faf6e58e4d2fc23bcb93dd9c33900a79e80..dbb172170dda1d0b4c777381edd02a79e804446e 100644 --- a/src/parser/parser.ts +++ b/src/parser/parser.ts @@ -1,4 +1,4 @@ -import forEach from "lodash/forEach"; +import forEach from 'lodash/forEach'; import { LinkKind, @@ -7,7 +7,7 @@ import { LinkContent, Arguments, Permalink, -} from "./types"; +} from './types'; /* * Verifiers are regexes which will match valid @@ -58,8 +58,8 @@ export function identifyTypeFromRegex<T, F>( */ export function parsePermalink( identifier: string -): Pick<Permalink, "roomKind" | "roomLink" | "eventId"> { - const [roomLink, eventId] = identifier.split("/"); +): Pick<Permalink, 'roomKind' | 'roomLink' | 'eventId'> { + const [roomLink, eventId] = identifier.split('/'); const roomKind = identifyTypeFromRegex( roomLink, roomVerifiers, @@ -89,9 +89,9 @@ export function parseArgs(args: string): Arguments { const params = new URLSearchParams(args); return { - vias: params.getAll("via"), - client: bottomExchange(params.get("client")), - sharer: bottomExchange(params.get("sharer")), + vias: params.getAll('via'), + client: bottomExchange(params.get('client')), + sharer: bottomExchange(params.get('sharer')), }; } @@ -101,7 +101,7 @@ export function parseArgs(args: string): Arguments { * be ParseFailed */ export function parseHash(hash: string): Link { - const [identifier, args] = hash.split("?"); + const [identifier, args] = hash.split('?'); const kind = identifyTypeFromRegex( identifier, @@ -150,9 +150,9 @@ export function toURL(origin: string, link: SafeLink): URL { forEach(link.arguments, (value, key) => { if (value === undefined) { // do nothing - } else if (key === "vias") { + } else if (key === 'vias') { (value as string[]).forEach((via) => - params.append("via", via) + params.append('via', via) ); } else { params.append(key, value.toString()); diff --git a/src/parser/types.ts b/src/parser/types.ts index 35c2d2aadf0c4f4606c0d8614c9127643b7738fc..5d8fa795ff0bc5d8cf05ea9d69839d074b158b81 100644 --- a/src/parser/types.ts +++ b/src/parser/types.ts @@ -13,12 +13,12 @@ export interface LinkContent { } export enum LinkKind { - Alias = "ALIAS", - RoomId = "ROOM_ID", - UserId = "USER_ID", - Permalink = "PERMALINK", - GroupId = "GROUP_ID", - ParseFailed = "PARSE_FAILED", + Alias = 'ALIAS', + RoomId = 'ROOM_ID', + UserId = 'USER_ID', + Permalink = 'PERMALINK', + GroupId = 'GROUP_ID', + ParseFailed = 'PARSE_FAILED', } export interface Alias extends LinkContent { diff --git a/src/utils/cypher-wrapper.ts b/src/utils/cypher-wrapper.ts index dec580c85c5846d1955d0f4564e7855e24754c95..5a43a4cbdaf07e2de9ae528d5a0063cbc2fc5687 100644 --- a/src/utils/cypher-wrapper.ts +++ b/src/utils/cypher-wrapper.ts @@ -14,6 +14,10 @@ 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 { Client, Room, @@ -23,8 +27,8 @@ import { searchPublicRooms, getUserDetails, convertMXCtoMediaQuery, -} from "matrix-cypher"; -import { LinkKind, Permalink } from "../parser/types"; +} from 'matrix-cypher'; +import { LinkKind, Permalink } from '../parser/types'; /* This is a collection of methods for providing fallback metadata * for cypher queries @@ -55,13 +59,13 @@ export const fallbackRoom = ({ const roomAlias_ = roomAlias ? roomAlias : identifier; return { aliases: [roomAlias_], - topic: "Unable to find room details.", + topic: 'Unable to find room details.', canonical_alias: roomAlias_, name: roomAlias_, num_joined_members: 0, room_id: roomId_, guest_can_join: true, - avatar_url: "", + avatar_url: '', world_readable: false, }; }; @@ -140,15 +144,15 @@ export async function getRoomFromPermalink( */ export function getMediaQueryFromMCX(mxc?: string): string { if (!mxc) { - return ""; + return ''; } try { return convertMXCtoMediaQuery( // TODO: replace with correct client - "https://matrix.org", + 'https://matrix.org', mxc ); } catch { - return ""; + return ''; } }