[Components][s]: Add misc components

src/components/misc/CustomLink.js

@@ -0,0 +1,27 @@
+import React from 'react'
+import PropTypes from 'prop-types';
+
+/**
+ * Creates a custom link with title
+ * @param {object} props 
+ * {
+ *  url: The url of the custom link
+ *  title: The title for the custom link
+ * } 
+ * @returns React Component
+ */
+const CustomLink = ({ url, title }) => (
+  <a
+    href={url}
+    className="bg-white hover:bg-gray-200 border text-black font-semibold py-2 px-4 rounded"
+  >
+    {title}
+  </a>
+);
+
+CustomLink.propTypes = {
+  url: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired
+}
+
+export default CustomLink;

src/components/misc/Error.js

@@ -0,0 +1,32 @@
+import React from 'react'
+import PropTypes from 'prop-types';
+
+/**
+ * Error message component with consistent portal style
+ * @param {object} props 
+ * {
+ *  message: The error message to display
+ * } 
+ * @returns 
+ */
+const ErrorMessage = ({ message }) => {
+  return (
+    <aside>
+      {message}
+      <style jsx>{`
+        aside {
+          padding: 1.5em;
+          font-size: 14px;
+          color: white;
+          background-color: red;
+        }
+      `}</style>
+    </aside>
+  );
+};
+
+ErrorMessage.propTypes = {
+  message: PropTypes.string.isRequired
+}
+
+export default ErrorMessage;