Initial commit

sergiodxa · Jan 5, 2019 · 098e945 · 098e945
commit 098e945
Show file tree

Hide file tree

Showing 11 changed files with 5,472 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+dist
+.cache
+*.log
diff --git a/.npmrc b/.npmrc
@@ -0,0 +1,11 @@
+*
+!dist/index.js
+!dist/index.js.map
+!dist/index.mjs
+!dist/index.mjs.map
+!dist/index.umd.js
+!dist/index.umd.js.map
+!index.d.ts
+!index.js.flow
+!package.json
+!readme.md
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Sergio Xalambrí
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/example/index.html b/example/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Example</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="./index.js"></script>
+  </body>
+</html>
diff --git a/example/index.js b/example/index.js
@@ -0,0 +1,25 @@
+import React from 'react';
+import { render } from 'react-dom';
+import usePermissions from '../src';
+
+const format = hasPermissions => {
+  switch (hasPermissions) {
+    case true: {
+      return "Permissions granted";
+    }
+    case false: {
+      return "Permissions denied";
+    }
+    case null: {
+      return "Asking for permissions";
+    }
+  }
+}
+
+function App() {
+  const hasPermissions = usePermissions("geolocation");
+  const content = format(hasPermissions);
+  return <h1>{content}</h1>;
+}
+
+render(<App />, window.root);
diff --git a/index.d.ts b/index.d.ts
@@ -0,0 +1,3 @@
+type PermissionState = null | true | false;
+
+export default function usePermissions(): PermissionState;
diff --git a/index.js.flow b/index.js.flow
@@ -0,0 +1,3 @@
+type PermissionState = null | true | false;
+
+declare export default function usePermissions(): PermissionState;
diff --git a/package.json b/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "react-use-permissions",
+  "description": "React hook for Permissions API",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "umd:main": "dist/index.umd.js",
+  "module": "dist/index.mjs",
+  "source": "src/index.js",
+  "author": "Sergio Xalambrí <hello@sergiodxa.com> (https://sergiodxa.com)",
+  "scripts": {
+    "build": "microbundle",
+    "example": "parcel example/index.html"
+  },
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^16.7.0-alpha.2",
+    "react-dom": "^16.7.0-alpha.2"
+  },
+  "devDependencies": {
+    "microbundle": "^0.9.0",
+    "parcel-bundler": "^1.11.0",
+    "react": "^16.7.0-alpha.2",
+    "react-dom": "^16.7.0-alpha.2"
+  }
+}
diff --git a/readme.md b/readme.md
@@ -0,0 +1,43 @@
+# `react-use-permsissions`
+
+> React hook for Permissions API
+
+> **Note:** This is using the new [React Hooks API Proposal](https://reactjs.org/docs/hooks-intro.html)
+> which is subject to change until React 16.7 final.
+>
+> You'll need to install `react`, `react-dom`, etc at `^16.7.0-alpha.0`
+
+## Install
+
+```sh
+yarn add react-use-permissions
+```
+
+## Usage
+
+```js
+import usePermissions from '../src';
+
+const format = hasPermissions => {
+  switch (hasPermissions) {
+    // User has granted permissions
+    case true: {
+      return "Permissions granted";
+    }
+    // User has denied permissions
+    case false: {
+      return "Permissions denied";
+    }
+    // User will be prompted for permissions
+    case null: {
+      return "Asking for permissions";
+    }
+  }
+}
+
+function App() {
+  const hasPermissions = usePermissions("geolocation");
+  const content = format(hasPermissions);
+  return <h1>{content}</h1>;
+}
+```
diff --git a/src/index.js b/src/index.js
@@ -0,0 +1,30 @@
+const { useState, useEffect } = require("react");
+
+function usePermissions (name) {
+  const [result, setResult] = useState(null);
+  useEffect(
+    () => {
+      navigator.permissions
+        .query({ name })
+        .then(result => {
+          if (result.state === "prompt")
+            return navigator.permissions.request({ name });
+          return result;
+        })
+        .then(result => {
+          switch (result.state) {
+            case "granted": {
+              return setResult(true);
+            }
+            case "denied": {
+              return setResult(false);
+            }
+          }
+        });
+    },
+    [name]
+  );
+  return result;
+}
+
+export default usePermissions;