Dome/matrix.to-dracula-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move to single quotes

Browse Source
This commit is contained in:
Jorik Schellekens
2020-08-18 11:16:31 +01:00
parent 0ac4116b24
commit f7abaadef1
32 changed files with 238 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Avatar.stories.tsx
+11 -7
View File
@@ -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"
/>
src/components/Avatar.tsx
+7 -7
View File
@@ -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)}
/>
);
};
src/components/Button.stories.tsx
+7 -7
View File
@@ -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>
);
src/components/Button.tsx
+4 -4
View File
@@ -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,
});
src/components/CreateLinkTile.stories.tsx
+5 -5
View File
@@ -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',
},
},
};
src/components/CreateLinkTile.tsx
+18 -18
View File
@@ -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} />;
src/components/EventPreview.tsx
+3 -3
View File
@@ -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;
src/components/Input.stories.tsx
+7 -7
View File
@@ -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],
src/components/Input.tsx
+5 -5
View File
@@ -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,
});
src/components/InviteTile.stories.tsx
+31 -27
View File
@@ -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,
}}
/>
src/components/InviteTile.tsx
+7 -7
View File
@@ -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;
src/components/LinkButton.tsx
+4 -4
View File
@@ -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;
src/components/LinkPreview.tsx
+10 -10
View File
@@ -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 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 { 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 (
src/components/MatrixTile.stories.tsx
+3 -3
View File
@@ -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 />;
src/components/MatrixTile.tsx
+4 -4
View File
@@ -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 (
src/components/RoomPreview.tsx
+4 -4
View File
@@ -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;
src/components/TextButton.stories.tsx
+5 -5
View File
@@ -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',
},
},
};
src/components/TextButton.tsx
+4 -4
View File
@@ -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;
src/components/Tile.stories.tsx
+5 -5
View File
@@ -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',
},
},
};
src/components/Tile.tsx
+4 -4
View File
@@ -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>
);
src/components/UserPreview.tsx
+4 -4
View File
@@ -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;