Merge pull request #4 from unsplash/refactor/pr1-feedback

Refactor: PR #1 feedback

.editorconfig

@@ -1,3 +1,6 @@
+# Note: prettier inherits from `indent_style`, `indent_size`/`tab_width`, and `max_line_length`
+# https://github.com/prettier/prettier/blob/cecf0657a521fa265b713274ed67ca39be4142cf/docs/api.md#prettierresolveconfigfilepath--options
+
 root = true
 
 [*]
@@ -6,16 +9,14 @@ indent_size = 2
 trim_trailing_whitespace = true
 insert_final_newline = true
 
-[patches/**.patch]
-trim_trailing_whitespace = false
-
 [.vscode/settings.json]
 indent_size = 4
 
-[*.snap]
-trim_trailing_whitespace = false
-
 # Git is sensitive to whitespace in diff files
 # https://stackoverflow.com/questions/50258565/git-editing-hunks-fails-when-file-has-other-hunks/50275053#50275053
 [*.diff]
 trim_trailing_whitespace = false
+
+[*.{ts,tsx}]
+# https://github.com/editorconfig/editorconfig/wiki/EditorConfig-Properties#max_line_length
+max_line_length = 100

.gitignore

@@ -1,31 +1,12 @@
 # OS X
 .DS_Store
 
-# Logs
-logs
-*.log
-npm-debug.log*
-
-# Runtime data
-pids
-*.pid
-*.seed
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (http://nodejs.org/api/addons.html)
-build/Release
-
 # Dependency directory
 # https://docs.npmjs.com/misc/faq#should-i-check-my-node-modules-folder-into-git
 node_modules
 
-# Optional npm cache directory
-.npm
-
-# Optional REPL history
-.node_repl_history
+# Yarn
+yarn-error.log
 
 # typescript dist
-dist/
+dist/

.npmignore

@@ -1,2 +1,6 @@
 tsconfig.json
 src
+.vscode
+.github
+.editorconfig
+.prettierrc

.prettierrc

@@ -1,6 +1,4 @@
 {
   "trailingComma": "all",
-  "printWidth": 100,
-  "tabWidth": 2,
   "singleQuote": true
 }

package.json

@@ -5,19 +5,27 @@
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "dependencies": {
-    "react": "^16.4.0"
+    "react": "^16.4.0",
+    "@types/react": "^16.3.17"
   },
   "devDependencies": {
-    "@types/react": "^16.3.17",
     "typescript": "^2.9.1"
   },
   "scripts": {
+    "compile": "tsc",
+    "prepublishOnly": "npm run compile",
     "test": "echo \"Error: no test specified\" && exit 0"
   },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/unsplash/react-progressive-enhancement.git"
   },
+  "contributors": [
+    {
+      "name": "Sami Jaber",
+      "email": "jabersami@gmail.com"
+    }
+  ],
   "engines": {
     "yarn": "1.5.1"
   },

src/consumer.tsx

@@ -3,12 +3,11 @@ import * as React from 'react';
 import { Consumer, ProgressiveEnhancementProp } from './context';
 import { ObjectOmit, getDisplayName } from './helpers';
 
-export const withIsEnhanced = function<OwnProps extends ProgressiveEnhancementProp>(
+export const withIsEnhanced = <OwnProps extends ProgressiveEnhancementProp>(
   ComposedComponent: React.ComponentType<OwnProps>,
-) {
-  type OwnPropsWithoutProgressiveEnhancementProp = ObjectOmit<OwnProps, ProgressiveEnhancementProp>;
-
-  const ComponentWithIsEnhanced: React.SFC<OwnPropsWithoutProgressiveEnhancementProp> = props => (
+) => {
+  type ComponentWithIsEnhancedType = React.SFC<ObjectOmit<OwnProps, ProgressiveEnhancementProp>>;
+  const ComponentWithIsEnhanced: ComponentWithIsEnhancedType = props => (
     <Consumer>
       {({ isEnhanced }) => <ComposedComponent isEnhanced={isEnhanced} {...props} />}
     </Consumer>
@@ -19,7 +18,9 @@ export const withIsEnhanced = function<OwnProps extends ProgressiveEnhancementPr
   return ComponentWithIsEnhanced;
 };
 
-export const progressivelyEnhance = function<Props>(ComposedComponent: React.ComponentType<Props>) {
+export const progressivelyEnhance = <Props extends {}>(
+  ComposedComponent: React.ComponentType<Props>,
+) => {
   const ProgressivelyEnhance: React.SFC<Props> = props => (
     <Consumer>
       {({ isEnhanced }) => (isEnhanced ? <ComposedComponent {...props} /> : null)}

src/helpers.ts

@@ -1,7 +1,7 @@
 import { ComponentType } from 'react';
 
 export const getDisplayName = (ComposedComponent: ComponentType<any>) =>
-  ComposedComponent.displayName || 'Component';
+  ComposedComponent.displayName !== undefined ? ComposedComponent.displayName : 'Component';
 
 export type Omit<T, K> = Pick<T, Exclude<keyof T, K>>;
 export type ObjectOmit<T extends K, K> = Omit<T, keyof K>;

src/provider.tsx

@@ -4,9 +4,9 @@ import { ProgressiveEnhancementProp, Provider, defaultValue } from './context';
 
 import { getDisplayName } from './helpers';
 
-export const enableProgressiveEnhancementsOnMount = function<Props>(
+export const enableProgressiveEnhancementsOnMount = <Props extends {}>(
   ComposedComponent: React.ComponentType<Props>,
-): React.ComponentType<Props> {
+): React.ComponentType<Props> => {
   class ProgressiveEnhancementProvider extends React.Component<Props, ProgressiveEnhancementProp> {
     static displayName = `ProgressiveEnhancementProvider(${getDisplayName(ComposedComponent)})`;