react-instagram-embed - npm Package Compare versions

Comparing version 1.5.0 to 2.0.0

es/index.d.ts

@@ -9,2 +9,3 @@ import * as React from 'react';
     url: string;
+    clientAccessToken: string;
     hideCaption: boolean;
@@ -11,0 +12,0 @@ containerTagName: T;

es/index.js

@@ -30,4 +30,6 @@ var __extends = (this && this.__extends) || (function () {
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
@@ -116,3 +118,3 @@ };
     InstagramEmbed.prototype.fetchEmbed = function (queryParams) {
-        this.request = this.createRequestPromise("https://api.instagram.com/oembed/?" + queryParams);
+        this.request = this.createRequestPromise("https://graph.facebook.com/v8.0/instagram_oembed/?" + queryParams);
         if (this.props.onLoading) {
@@ -124,3 +126,3 @@ this.props.onLoading();
     InstagramEmbed.prototype.omitComponentProps = function () {
-        var _a = this.props, url = _a.url, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth, containerTagName = _a.containerTagName, onLoading = _a.onLoading, onSuccess = _a.onSuccess, onAfterRender = _a.onAfterRender, onFailure = _a.onFailure, protocol = _a.protocol, injectScript = _a.injectScript, rest = __rest(_a, ["url", "hideCaption", "maxWidth", "containerTagName", "onLoading", "onSuccess", "onAfterRender", "onFailure", "protocol", "injectScript"]);
+        var _a = this.props, url = _a.url, clientAccessToken = _a.clientAccessToken, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth, containerTagName = _a.containerTagName, onLoading = _a.onLoading, onSuccess = _a.onSuccess, onAfterRender = _a.onAfterRender, onFailure = _a.onFailure, protocol = _a.protocol, injectScript = _a.injectScript, rest = __rest(_a, ["url", "clientAccessToken", "hideCaption", "maxWidth", "containerTagName", "onLoading", "onSuccess", "onAfterRender", "onFailure", "protocol", "injectScript"]);
         return rest;
@@ -156,5 +158,6 @@ };
     InstagramEmbed.prototype.getQueryParams = function (_a) {
-        var url = _a.url, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth;
+        var url = _a.url, clientAccessToken = _a.clientAccessToken, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth;
         return qs.stringify({
             url: url,
+            access_token: clientAccessToken,
             hidecaption: hideCaption,
@@ -161,0 +164,0 @@ maxwidth: typeof maxWidth === 'number' && maxWidth >= 320 ? maxWidth : undefined,

lib/index.d.ts

@@ -9,2 +9,3 @@ import * as React from 'react';
     url: string;
+    clientAccessToken: string;
     hideCaption: boolean;
@@ -11,0 +12,0 @@ containerTagName: T;

lib/index.js

@@ -31,4 +31,6 @@ "use strict";
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
@@ -118,3 +120,3 @@ };
     InstagramEmbed.prototype.fetchEmbed = function (queryParams) {
-        this.request = this.createRequestPromise("https://api.instagram.com/oembed/?" + queryParams);
+        this.request = this.createRequestPromise("https://graph.facebook.com/v8.0/instagram_oembed/?" + queryParams);
         if (this.props.onLoading) {
@@ -126,3 +128,3 @@ this.props.onLoading();
     InstagramEmbed.prototype.omitComponentProps = function () {
-        var _a = this.props, url = _a.url, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth, containerTagName = _a.containerTagName, onLoading = _a.onLoading, onSuccess = _a.onSuccess, onAfterRender = _a.onAfterRender, onFailure = _a.onFailure, protocol = _a.protocol, injectScript = _a.injectScript, rest = __rest(_a, ["url", "hideCaption", "maxWidth", "containerTagName", "onLoading", "onSuccess", "onAfterRender", "onFailure", "protocol", "injectScript"]);
+        var _a = this.props, url = _a.url, clientAccessToken = _a.clientAccessToken, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth, containerTagName = _a.containerTagName, onLoading = _a.onLoading, onSuccess = _a.onSuccess, onAfterRender = _a.onAfterRender, onFailure = _a.onFailure, protocol = _a.protocol, injectScript = _a.injectScript, rest = __rest(_a, ["url", "clientAccessToken", "hideCaption", "maxWidth", "containerTagName", "onLoading", "onSuccess", "onAfterRender", "onFailure", "protocol", "injectScript"]);
         return rest;
@@ -158,5 +160,6 @@ };
     InstagramEmbed.prototype.getQueryParams = function (_a) {
-        var url = _a.url, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth;
+        var url = _a.url, clientAccessToken = _a.clientAccessToken, hideCaption = _a.hideCaption, maxWidth = _a.maxWidth;
         return qs.stringify({
             url: url,
+            access_token: clientAccessToken,
             hidecaption: hideCaption,
@@ -163,0 +166,0 @@ maxwidth: typeof maxWidth === 'number' && maxWidth >= 320 ? maxWidth : undefined,

package.json

 {
   "name": "react-instagram-embed",
-  "version": "1.5.0",
+  "version": "2.0.0",
   "description": "React embedding Instagram posts component",
@@ -66,48 +66,49 @@ "main": "lib/index.js",
   "devDependencies": {
-    "@babel/core": "^7.2.2",
-    "@babel/plugin-proposal-class-properties": "^7.3.0",
-    "@babel/polyfill": "^7.2.5",
-    "@babel/preset-env": "^7.3.1",
-    "@babel/preset-react": "^7.0.0",
-    "@types/enzyme": "^3.1.15",
-    "@types/enzyme-adapter-react-16": "^1.0.3",
-    "@types/highlight.js": "^9.12.3",
-    "@types/jest": "^23.3.13",
-    "@types/query-string": "^6.2.0",
-    "@types/react": "^16.7.20",
-    "@types/react-dom": "^16.0.11",
-    "awesome-typescript-loader": "^5.2.1",
-    "babel-loader": "^8.0.5",
-    "codecov": "^3.1.0",
-    "css-loader": "^2.1.0",
-    "custom-tslint-formatters": "^2.4.0",
-    "enzyme": "^3.8.0",
-    "enzyme-adapter-react-16": "^1.7.1",
-    "enzyme-to-json": "^3.3.5",
-    "gh-pages": "^1.2.0",
-    "highlight.js": "^9.13.1",
-    "html-webpack-plugin": "^3.2.0",
-    "husky": "^1.3.1",
-    "jest": "^23.6.0",
-    "lint-staged": "^8.1.0",
-    "normalize.css": "^8.0.1",
-    "prettier": "^1.16.1",
-    "raf": "^3.4.1",
-    "react": "^16.7.0",
-    "react-dom": "^16.7.0",
-    "react-ghfork": "^0.5.1",
-    "react-hot-loader": "^4.6.3",
-    "style-loader": "^0.23.1",
-    "ts-jest": "^23.10.5",
-    "tslint": "^5.12.1",
-    "tslint-config-prettier": "^1.17.0",
-    "tslint-eslint-rules": "^5.4.0",
-    "tslint-plugin-prettier": "^2.0.1",
-    "tslint-react": "^3.6.0",
-    "typescript": "^3.2.4",
-    "uglifyjs-webpack-plugin": "^2.1.1",
-    "webpack": "^4.29.0",
-    "webpack-cli": "^3.2.1",
-    "webpack-dev-server": "^3.1.14"
+    "@babel/core": "7.4.5",
+    "@babel/plugin-proposal-class-properties": "7.4.4",
+    "@babel/polyfill": "7.4.4",
+    "@babel/preset-env": "7.4.5",
+    "@babel/preset-react": "7.0.0",
+    "@types/enzyme": "3.9.4",
+    "@types/enzyme-adapter-react-16": "1.0.6",
+    "@types/highlight.js": "9.12.4",
+    "@types/jest": "24.0.25",
+    "@types/query-string": "6.2.0",
+    "@types/react": "16.8.25",
+    "@types/react-dom": "16.8.5",
+    "awesome-typescript-loader": "5.2.1",
+    "babel-loader": "8.0.6",
+    "codecov": "3.7.1",
+    "css-loader": "2.1.1",
+    "custom-tslint-formatters": "2.4.0",
+    "dotenv-webpack": "5.1.0",
+    "enzyme": "3.9.0",
+    "enzyme-adapter-react-16": "1.13.2",
+    "enzyme-to-json": "3.3.5",
+    "gh-pages": "1.2.0",
+    "highlight.js": "9.15.10",
+    "html-webpack-plugin": "3.2.0",
+    "husky": "1.3.1",
+    "jest": "24.8.0",
+    "lint-staged": "8.1.7",
+    "normalize.css": "8.0.1",
+    "prettier": "1.17.1",
+    "raf": "3.4.1",
+    "react": "16.8.6",
+    "react-dom": "16.8.6",
+    "react-ghfork": "0.5.2",
+    "react-hot-loader": "4.8.8",
+    "style-loader": "0.23.1",
+    "ts-jest": "24.0.2",
+    "tslint": "5.17.0",
+    "tslint-config-prettier": "1.18.0",
+    "tslint-eslint-rules": "5.4.0",
+    "tslint-plugin-prettier": "2.0.1",
+    "tslint-react": "3.6.0",
+    "typescript": "3.5.3",
+    "uglifyjs-webpack-plugin": "2.1.3",
+    "webpack": "4.32.2",
+    "webpack-cli": "3.3.12",
+    "webpack-dev-server": "3.4.1"
   }
 }

README.md

@@ -26,2 +26,3 @@ # react-instagram-embed
   url='https://instagr.am/p/Zw9o4/'
+  clientAccessToken='123|456'
   maxWidth={320}
@@ -39,5 +40,8 @@ hideCaption={false}
 
+Access token is combination of App Id and Client Token. See https://developers.facebook.com/docs/instagram/oembed/#access-tokens for more details.
+
 ## props
 
 - `url` {String} Instagram URL. Required
+- `clientAccessToken` {String} Instagram Client Access Token. Required
 - `maxWidth` {Number} Max width. Minimum size is `320`. Default `undefined`
@@ -44,0 +48,0 @@ - `hideCaption` {Boolean} Default `false`

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

23452

increased by3.5%

Lines of code

478

increased by1.7%

Number of lines in readme file

68

increased by6.25%

Number of medium supply chain risk alerts

2

decreased by-33.33%

Worsened metrics

Dev dependency count

46

increased by2.22%

No dependency changes