From 37df94f7fa7ca3107ca041eaa29e99512a516681 Mon Sep 17 00:00:00 2001
From: Mike Stone <mikestone14@gmail.com>
Date: Wed, 9 Nov 2016 17:54:34 -0500
Subject: [PATCH] Convert to ts (#386)

Converts email validator and  Avatar component to typescript
---
 frontend/components/Avatar/Avatar.jsx         | 32 ----------------
 frontend/components/Avatar/Avatar.tsx         | 38 +++++++++++++++++++
 frontend/components/Avatar/index.js           |  2 +-
 .../forms/validators/valid_email/index.js     | 10 +----
 .../validators/valid_email/valid_email.ts     |  9 +++++
 .../validate_equality/validate_equality.ts    |  0
 package.json                                  |  2 +-
 7 files changed, 50 insertions(+), 43 deletions(-)
 delete mode 100644 frontend/components/Avatar/Avatar.jsx
 create mode 100644 frontend/components/Avatar/Avatar.tsx
 create mode 100644 frontend/components/forms/validators/valid_email/valid_email.ts
 create mode 100644 frontend/components/forms/validators/validate_equality/validate_equality.ts

diff --git a/frontend/components/Avatar/Avatar.jsx b/frontend/components/Avatar/Avatar.jsx
deleted file mode 100644
index cb71f5627..000000000
--- a/frontend/components/Avatar/Avatar.jsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React, { PropTypes } from 'react';
-import classnames from 'classnames';
-
-import userInterface from '../../interfaces/user';
-
-const Avatar = ({ size, className, style, user }) => {
-  const { gravatarURL } = user;
-  const isSmall = size && size.toLowerCase() === 'small';
-  const avatarClasses = classnames(
-    'avatar',
-    { 'avatar--small': isSmall },
-    className
-  );
-
-  return (
-    <img
-      alt="User avatar"
-      src={gravatarURL}
-      className={avatarClasses}
-      style={style}
-    />
-  );
-};
-
-Avatar.propTypes = {
-  size: PropTypes.string,
-  className: PropTypes.string,
-  style: PropTypes.object, // eslint-disable-line react/forbid-prop-types
-  user: userInterface.isRequired,
-};
-
-export default Avatar;
diff --git a/frontend/components/Avatar/Avatar.tsx b/frontend/components/Avatar/Avatar.tsx
new file mode 100644
index 000000000..60aaf83fb
--- /dev/null
+++ b/frontend/components/Avatar/Avatar.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+const classnames = require('classnames');
+
+interface IAvatarUserInterface {
+  gravatarURL: string;
+}
+
+interface IAvatarInterface {
+  className?: string;
+  size?: string;
+  user: IAvatarUserInterface;
+}
+
+interface IAvatarState {}
+
+const baseClass = 'avatar';
+
+class Avatar extends React.Component<IAvatarInterface, IAvatarState> {
+  render (): JSX.Element {
+    const { className, size, user } = this.props;
+    const isSmall = size && size.toLowerCase() === 'small';
+    const avatarClasses = classnames(baseClass, {
+      [`${baseClass}--${size}`]: isSmall,
+      className,
+    });
+    const { gravatarURL } = user;
+
+    return (
+      <img
+        alt='User Avatar'
+        className={avatarClasses}
+        src={gravatarURL}
+      />
+    );
+  }
+}
+
+export default Avatar;
diff --git a/frontend/components/Avatar/index.js b/frontend/components/Avatar/index.js
index 051cfa2dd..722b8c348 100644
--- a/frontend/components/Avatar/index.js
+++ b/frontend/components/Avatar/index.js
@@ -1 +1 @@
-export default from './Avatar';
+export default from './Avatar.tsx';
diff --git a/frontend/components/forms/validators/valid_email/index.js b/frontend/components/forms/validators/valid_email/index.js
index 06769f390..b078ab24e 100644
--- a/frontend/components/forms/validators/valid_email/index.js
+++ b/frontend/components/forms/validators/valid_email/index.js
@@ -1,9 +1 @@
-const EMAIL_REGEX = /\S+@\S+\.\S+/;
-
-export default (email) => {
-  if (EMAIL_REGEX.test(email)) {
-    return true;
-  }
-
-  return false;
-};
+export default from './valid_email.ts';
diff --git a/frontend/components/forms/validators/valid_email/valid_email.ts b/frontend/components/forms/validators/valid_email/valid_email.ts
new file mode 100644
index 000000000..33a972156
--- /dev/null
+++ b/frontend/components/forms/validators/valid_email/valid_email.ts
@@ -0,0 +1,9 @@
+const EMAIL_REGEX = /\S+@\S+\.\S+/;
+
+export default (email: string): boolean => {
+  if (EMAIL_REGEX.test(email)) {
+    return true;
+  }
+
+  return false;
+};
diff --git a/frontend/components/forms/validators/validate_equality/validate_equality.ts b/frontend/components/forms/validators/validate_equality/validate_equality.ts
new file mode 100644
index 000000000..e69de29bb
diff --git a/package.json b/package.json
index 9958111d3..9db0a5373 100644
--- a/package.json
+++ b/package.json
@@ -45,7 +45,7 @@
     "moment": "^2.15.1",
     "nock": "^8.0.0",
     "node-bourbon": "^4.2.8",
-    "node-sass": "^3.10.0",
+    "node-sass": "^3.10.1",
     "normalizr": "^2.2.1",
     "postcss-functions": "^2.1.0",
     "postcss-loader": "^0.8.0",