amplify-auth-next-storage - npm Package Compare versions

Comparing version 1.1.0 to 1.1.1

next-storage.cjs.js

@@ -6,12 +6,2 @@ 'use strict';
 /**
- * "Borrowed" from https://github.com/js-cookie/js-cookie/blob/master/src/rfc6265.mjs
- * @param value
- * @returns {string}
- */
-
-function encodeCookie(value) {
-  return encodeURIComponent(value).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g, decodeURIComponent);
-}
-
-/**
  * @class NextStorage
@@ -45,3 +35,3 @@ */
    * @param {string} key - the key for the item
-   * @param {object} value - the value
+   * @param {string} value - the value
    * @returns {string} value that was set
@@ -51,3 +41,3 @@ */
   setItem(key, value) {
-    nookies.setCookie(this.ctx, key, encodeCookie(value), {
+    nookies.setCookie(this.ctx, key, value, {
       path: this.path,
@@ -54,0 +44,0 @@ maxAge: this.expires * 86400,

next-storage.js

 import { setCookie, parseCookies, destroyCookie } from 'nookies';
 
 /**
- * "Borrowed" from https://github.com/js-cookie/js-cookie/blob/master/src/rfc6265.mjs
- * @param value
- * @returns {string}
- */
-
-function encodeCookie(value) {
-  return encodeURIComponent(value).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g, decodeURIComponent);
-}
-
-/**
  * @class NextStorage
@@ -42,3 +32,3 @@ */
    * @param {string} key - the key for the item
-   * @param {object} value - the value
+   * @param {string} value - the value
    * @returns {string} value that was set
@@ -48,3 +38,3 @@ */
   setItem(key, value) {
-    setCookie(this.ctx, key, encodeCookie(value), {
+    setCookie(this.ctx, key, value, {
       path: this.path,
@@ -51,0 +41,0 @@ maxAge: this.expires * 86400,

package.json

 {
   "name": "amplify-auth-next-storage",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Isomorphic cookie storage for Next.js apps using @aws-amplify/auth",
@@ -5,0 +5,0 @@ "main": "next-storage.cjs.js",

README.md

@@ -9,11 +9,32 @@ # amplify-auth-next-storage
 
+### Options
+
+```js
+new NextStorage(ctx, options)
+```
+
+- `ctx` is the Next.js ctx object, only required server-side. Pass `null` or `undefined` on the client-side.
+- `options` are identical to Amplify's `cookieStorage` configuration options.
+
+https://aws-amplify.github.io/docs/js/authentication#manual-setup
+
+| Option | Type | Default | Description |
+| --- | --- | --- | --- |
+| domain **(required)** | string | *none* | Cookies domain |
+| expires | number | 365 | Cookie expiration in days |
+| path | string | / | Cookies path |
+| secure | boolean | true | Cookie secure flag |
+
 ### Usage
 
 ```js
-// components/Component.js
+// utils/auth-utils.js
 
+// Placing your configuration into a reusable utility function isn't strictly
+// necessary, but makes repeated use of Auth.configure() easier
+
 import Auth from '@aws-amplify/auth';
 import NextStorage from 'amplify-auth-next-storage';
 
-Component.getInitialProps = async (ctx) => {
+export function configurePool(ctx) {
   Auth.configure({
@@ -30,25 +51,60 @@ region: 'us-east-1',
   });
+}
 
-  return {};
+// pages/_app.js
+
+import React from 'react';
+import { configurePool } from 'utils/auth-utils';
+import fetch from 'node-fetch';
+
+global.fetch = fetch; // One workaround for getting Auth.configure to work properly server-side
+
+const YourApp = ({ Component, pageProps }) => {
+  // Running this once at the app level, client-side, allows you to
+  // use `Auth` methods in all of your components 
+
+  configurePool();
+
+  return <Component {...pageProps} />;
 };
-```
 
-### Options
+YourApp.getInitialProps = async (appContext) => {
+  const appProps = await App.getInitialProps(appContext);
 
-```js
-new NextStorage(ctx, options)
-```
+  // However, we need to configure the pool every time it's needed within getInitialProps
 
-- `ctx` is the Next.js ctx object
-- `options` are identical to Amplify's `cookieStorage` configuration options.
+  configurePool(appContext.ctx);
 
-https://aws-amplify.github.io/docs/js/authentication#manual-setup
+  // ... do stuff with Auth. e.g. Auth.currentUserInfo
 
-| Option | Type | Default | Description |
-| --- | --- | --- | --- |
-| domain **(required)** | string | *none* | Cookies domain |
-| expires | number | 365 | Cookie expiration in days |
-| path | string | / | Cookies path |
-| secure | boolean | true | Cookie secure flag |
+  return { ...appProps };
+};
 
+export default YourApp;
+
+// components/FancyComponent.js
+
+import React from 'react';
+import { configurePool } from 'utils/auth-utils';
+
+const FancyComponent = () => {
+  // You can use auth here without configuring the pool since we already
+  // configured it at the YourApp level
+
+  Auth.currentUserInfo().then(currentUser => console.log(currentUser));
+
+  return <div>Fancy Component</div>;
+}
+
+FancyComponent.getInitialProps = async (ctx) => {
+  // If we need Auth in this component server-side, we need to configure the pool again
+
+  configurePool(ctx);
+
+  await Auth.currentUserInfo().then(currentUser => console.log(currentUser));
+
+  return {};
+}
+```
+
 ### Notes
@@ -55,0 +111,0 @@

No alert changes

Improved metrics

Total package byte prevSize

8547

14.43%

Number of lines in readme file

120

87.5%

Worsened metrics

Lines of code

150

-9.64%

No dependency changes