New JSX transform

26 files changed, 41 insertions, 47 deletions

diff --git a/vnext/src/App.js b/vnext/src/App.js
index ccdae78e..91adf0b9 100644
--- a/vnext/src/App.js
+++ b/vnext/src/App.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { Route, Link, Switch } from 'react-router-dom';
 import { useScroll, useRafState } from 'react-use';
 import qs from 'qs';
diff --git a/vnext/src/index.js b/vnext/src/index.js
index c9b9373a..cdb592e8 100644
--- a/vnext/src/index.js
+++ b/vnext/src/index.js
@@ -1,4 +1,4 @@
-import React, { lazy, Suspense } from 'react';
+import { StrictMode, lazy, Suspense } from 'react';
 import ReactDOM from 'react-dom';
 import { BrowserRouter } from 'react-router-dom';
 import { CookiesProvider } from 'react-cookie';
@@ -16,7 +16,7 @@ function LoadingView() {
 const Juick = lazy(() => import('./App'));
 
 const JuickApp = () => (
-    <React.StrictMode>
+    <StrictMode>
         <Suspense fallback={LoadingView()}>
             <CookiesProvider>
                 <BrowserRouter>
@@ -24,7 +24,7 @@ const JuickApp = () => (
                 </BrowserRouter>
             </CookiesProvider>
         </Suspense>
-    </React.StrictMode>
+    </StrictMode>
 );
 
 ReactDOM.hydrate(<JuickApp />, document.getElementById('app'));
diff --git a/vnext/src/ui/Avatar.js b/vnext/src/ui/Avatar.js
index e08c1ba4..b7ffb102 100644
--- a/vnext/src/ui/Avatar.js
+++ b/vnext/src/ui/Avatar.js
@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+import { memo } from 'react';
 import { Link } from 'react-router-dom';
 
 import Icon from './Icon';
diff --git a/vnext/src/ui/Button.js b/vnext/src/ui/Button.js
index 033c972c..62e772b9 100644
--- a/vnext/src/ui/Button.js
+++ b/vnext/src/ui/Button.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import { memo } from 'react';
 
 import './Button.css';
 
@@ -11,4 +11,4 @@ function Button(props) {
     );
 }
 
-export default React.memo(Button);
+export default memo(Button);
diff --git a/vnext/src/ui/Chat.js b/vnext/src/ui/Chat.js
index 21f02635..5ecb9c0f 100644
--- a/vnext/src/ui/Chat.js
+++ b/vnext/src/ui/Chat.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useCallback } from 'react';
+import { useEffect, useState, useCallback } from 'react';
 import { useParams } from 'react-router-dom';
 import moment from 'moment';
 
diff --git a/vnext/src/ui/Contact.js b/vnext/src/ui/Contact.js
index 9e6416bb..2d009738 100644
--- a/vnext/src/ui/Contact.js
+++ b/vnext/src/ui/Contact.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import { memo } from 'react';
 
 import Avatar from './Avatar';
 
@@ -21,4 +21,4 @@ function Contact({ user, style }) {
     );
 }
 
-export default React.memo(Contact);
+export default memo(Contact);
diff --git a/vnext/src/ui/Contacts.js b/vnext/src/ui/Contacts.js
index 8160a24e..2a727b82 100644
--- a/vnext/src/ui/Contacts.js
+++ b/vnext/src/ui/Contacts.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 
 import { getChats } from '../api';
 
diff --git a/vnext/src/ui/Feeds.js b/vnext/src/ui/Feeds.js
index 9bbecf89..7c51f3e7 100644
--- a/vnext/src/ui/Feeds.js
+++ b/vnext/src/ui/Feeds.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 import { Link, useLocation, useHistory, useParams } from 'react-router-dom';
 
 import qs from 'qs';
diff --git a/vnext/src/ui/Header.js b/vnext/src/ui/Header.js
index d8fe23e0..1574a489 100644
--- a/vnext/src/ui/Header.js
+++ b/vnext/src/ui/Header.js
@@ -1,4 +1,4 @@
-import React, { memo, useCallback } from 'react';
+import { memo, useCallback } from 'react';
 import { Link, useHistory } from 'react-router-dom';
 
 import Icon from './Icon';
diff --git a/vnext/src/ui/Icon.js b/vnext/src/ui/Icon.js
index af9a0944..c959e2d1 100644
--- a/vnext/src/ui/Icon.js
+++ b/vnext/src/ui/Icon.js
@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+import { createElement, memo } from 'react';
 import PropTypes from 'prop-types';
 
 // @ts-ignore
@@ -23,8 +23,8 @@ function IconElement(props) {
 
     var name = '#' + props.name + '-icon';
     var useTag = `<use xlink:href='${evilIcons}${name}' />`;
-    var Icon = React.createElement('svg', { className: 'icon__cnt', dangerouslySetInnerHTML: { __html: useTag } });
-    return React.createElement(
+    var Icon = createElement('svg', { className: 'icon__cnt', dangerouslySetInnerHTML: { __html: useTag } });
+    return createElement(
         'div',
         { className: klass },
         wrapSpinner(Icon, klass)
@@ -37,7 +37,7 @@ function IconElement(props) {
  */
 function wrapSpinner(Html, klass) {
     if (klass.indexOf('spinner') > -1) {
-        return React.createElement(
+        return createElement(
             'div',
             { className: 'icon__spinner' },
             Html
diff --git a/vnext/src/ui/Input.js b/vnext/src/ui/Input.js
index e4fdefa0..2f01f0c6 100644
--- a/vnext/src/ui/Input.js
+++ b/vnext/src/ui/Input.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import { memo } from 'react';
 
 import './Input.css';
 
@@ -20,4 +20,4 @@ function Input({ name, value, ...rest }) {
     );
 }
 
-export default React.memo(Input);
+export default memo(Input);
diff --git a/vnext/src/ui/Login.js b/vnext/src/ui/Login.js
index b5fbc700..774664c0 100644
--- a/vnext/src/ui/Login.js
+++ b/vnext/src/ui/Login.js
@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';
 import { useLocation, useHistory } from 'react-router-dom';
 
 import Icon from './Icon';
diff --git a/vnext/src/ui/Message.js b/vnext/src/ui/Message.js
index 83c6fcab..620fe017 100644
--- a/vnext/src/ui/Message.js
+++ b/vnext/src/ui/Message.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from 'react';
+import { memo, useEffect, useRef } from 'react';
 
 import { Link } from 'react-router-dom';
 import moment from 'moment';
@@ -130,7 +130,7 @@ function Tags({ data, user }) {
     );
 }
 
-const TagsList = React.memo(Tags);
+const TagsList = memo(Tags);
 
 function Recommends({ forMessage }) {
     const { likes, recommendations } = forMessage;
@@ -148,4 +148,4 @@ function Recommends({ forMessage }) {
     ) || null;
 }
 
-const Recommendations = React.memo(Recommends);
+const Recommendations = memo(Recommends);
diff --git a/vnext/src/ui/MessageInput.js b/vnext/src/ui/MessageInput.js
index e20d5100..6003a15c 100644
--- a/vnext/src/ui/MessageInput.js
+++ b/vnext/src/ui/MessageInput.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react';
+import { useState, useEffect, useRef } from 'react';
 
 import Icon from './Icon';
 import Button from './Button';
diff --git a/vnext/src/ui/PM.js b/vnext/src/ui/PM.js
index 9903b4e5..8885153d 100644
--- a/vnext/src/ui/PM.js
+++ b/vnext/src/ui/PM.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import { memo } from 'react';
 
 import Avatar from './Avatar';
 import { format } from '../utils/embed';
@@ -18,7 +18,7 @@ function PM(props) {
     );
 }
 
-export default React.memo(PM);
+export default memo(PM);
 /*
 PM.propTypes = {
     chat: MessageType.isRequired,
diff --git a/vnext/src/ui/Post.js b/vnext/src/ui/Post.js
index 7c5c07cd..d8d841e1 100644
--- a/vnext/src/ui/Post.js
+++ b/vnext/src/ui/Post.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { useLocation, useHistory } from 'react-router-dom';
 
 import qs from 'qs';
diff --git a/vnext/src/ui/SearchBox.js b/vnext/src/ui/SearchBox.js
index 005739d8..c79c9e8f 100644
--- a/vnext/src/ui/SearchBox.js
+++ b/vnext/src/ui/SearchBox.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import { useFormState } from 'react-use-form-state';
 
 /**
@@ -6,9 +5,9 @@ import { useFormState } from 'react-use-form-state';
  * @property {function} onSearch
  */
 
- /**
- * @typedef {SearchBoxPropsFields} SearchBoxProps
- */
+/**
+* @typedef {SearchBoxPropsFields} SearchBoxProps
+*/
 
 /**
  * @param {SearchBoxProps} props
diff --git a/vnext/src/ui/Settings.js b/vnext/src/ui/Settings.js
index 4b9dc2e9..ccafffa3 100644
--- a/vnext/src/ui/Settings.js
+++ b/vnext/src/ui/Settings.js
@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react';
+import { Fragment, useState, useRef } from 'react';
 
 import { me, updateAvatar } from '../api';
 
@@ -134,9 +134,9 @@ export default function Settings({ visitor, onChange }) {
                             <p>
                                 {
                                     visitor.jids.map(jid =>
-                                        <React.Fragment key={jid}>
+                                        <Fragment key={jid}>
                                             <label><input type="radio" name="delete" value={jid} />{jid}</label><br />
-                                        </React.Fragment>
+                                        </Fragment>
                                     )
                                 }
                             </p>
@@ -163,12 +163,12 @@ export default function Settings({ visitor, onChange }) {
                     <p>
                         {
                             visitor.emails ? visitor.emails.map(email =>
-                                <React.Fragment key={email}>
+                                <Fragment key={email}>
                                     <label>
                                         <input type="radio" name="account" value={email} />{email}
                                     </label>
                                     <br />
-                                </React.Fragment>
+                                </Fragment>
                             ) : '-'
                         }
                     </p>
diff --git a/vnext/src/ui/Spinner.js b/vnext/src/ui/Spinner.js
index e866369f..b5027c08 100644
--- a/vnext/src/ui/Spinner.js
+++ b/vnext/src/ui/Spinner.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import { memo } from 'react';
 import ContentLoader from 'react-content-loader';
 
 function Spinner(props) {
@@ -23,7 +23,7 @@ function Spinner(props) {
     );
 }
 
-export default React.memo(Spinner);
+export default memo(Spinner);
 
 export function ChatSpinner(props) {
     return (
diff --git a/vnext/src/ui/Thread.js b/vnext/src/ui/Thread.js
index f5cab72f..92638104 100644
--- a/vnext/src/ui/Thread.js
+++ b/vnext/src/ui/Thread.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useRef, useCallback } from 'react';
+import { useEffect, useState, useRef, useCallback } from 'react';
 import { useLocation, useParams } from 'react-router-dom';
 
 import Message from './Message';
diff --git a/vnext/src/ui/UploadButton.js b/vnext/src/ui/UploadButton.js
index 28a1f340..78991340 100644
--- a/vnext/src/ui/UploadButton.js
+++ b/vnext/src/ui/UploadButton.js
@@ -1,5 +1,3 @@
-import React from 'react';
-
 import Icon from './Icon';
 
 /**
diff --git a/vnext/src/ui/UserInfo.js b/vnext/src/ui/UserInfo.js
index f44fb77c..cb6ad792 100644
--- a/vnext/src/ui/UserInfo.js
+++ b/vnext/src/ui/UserInfo.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react';
+import { memo, useState, useEffect, useRef } from 'react';
 import { Link } from 'react-router-dom';
 
 import { info, fetchUserUri, update } from '../api';
@@ -87,7 +87,7 @@ function Summary({ user }) {
     );
 }
 
-const UserSummary = React.memo(Summary);
+const UserSummary = memo(Summary);
 
 
 /**
diff --git a/vnext/src/ui/Users.js b/vnext/src/ui/Users.js
index 4dd929fb..2672c9cd 100644
--- a/vnext/src/ui/Users.js
+++ b/vnext/src/ui/Users.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { useParams } from 'react-router-dom';
 
 import UserInfo from './UserInfo';
diff --git a/vnext/src/ui/__tests__/Avatar.test.js b/vnext/src/ui/__tests__/Avatar.test.js
index e7221871..f454f6c7 100644
--- a/vnext/src/ui/__tests__/Avatar.test.js
+++ b/vnext/src/ui/__tests__/Avatar.test.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 
 import Avatar from '../Avatar';
diff --git a/vnext/src/ui/__tests__/MessageInput-test.js b/vnext/src/ui/__tests__/MessageInput-test.js
index 9603d1fe..261786d0 100644
--- a/vnext/src/ui/__tests__/MessageInput-test.js
+++ b/vnext/src/ui/__tests__/MessageInput-test.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import { create, act } from 'react-test-renderer';
 
 import MessageInput from '../MessageInput';
diff --git a/vnext/src/ui/__tests__/UserLink.test.js b/vnext/src/ui/__tests__/UserLink.test.js
index a75344b0..30c35928 100644
--- a/vnext/src/ui/__tests__/UserLink.test.js
+++ b/vnext/src/ui/__tests__/UserLink.test.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import { MemoryRouter, Switch, Route } from 'react-router-dom';
 
 import { UserLink } from '../UserInfo';