use seafile-react-image-lightbox (#4413)

frontend/package-lock.json

@@ -117,6 +117,36 @@
         "warning": "^3.0.0"
       }
     },
+    "@seafile/react-image-lightbox": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/@seafile/react-image-lightbox/-/react-image-lightbox-0.0.1.tgz",
+      "integrity": "sha512-ef3WrpMSwyJkSuqS30H+IXZU+nmyNW7uO8NSg0YRS0LawvPZnD2cW1FsxAzYTl2fH+l4nqkh//6boGcCfqSsNg==",
+      "requires": {
+        "prop-types": "^15.6.2",
+        "react-modal": "^3.11.1"
+      },
+      "dependencies": {
+        "react-modal": {
+          "version": "3.11.1",
+          "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.1.tgz",
+          "integrity": "sha512-8uN744Yq0X2lbfSLxsEEc2UV3RjSRb4yDVxRQ1aGzPo86QjNOwhQSukDb8U8kR+636TRTvfMren10fgOjAy9eA==",
+          "requires": {
+            "exenv": "^1.2.0",
+            "prop-types": "^15.5.10",
+            "react-lifecycles-compat": "^3.0.0",
+            "warning": "^4.0.3"
+          }
+        },
+        "warning": {
+          "version": "4.0.3",
+          "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+          "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+          "requires": {
+            "loose-envify": "^1.0.0"
+          }
+        }
+      }
+    },
     "@seafile/resumablejs": {
       "version": "1.1.15",
       "resolved": "https://registry.npmjs.org/@seafile/resumablejs/-/resumablejs-1.1.15.tgz",
@@ -5548,7 +5578,7 @@
     },
     "git-url-parse": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/git-url-parse/-/git-url-parse-5.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/git-url-parse/-/git-url-parse-5.0.1.tgz",
       "integrity": "sha1-/j15xnRq4FBIz6UIyB553du6OEM=",
       "requires": {
         "git-up": "^1.0.0"
@@ -8583,7 +8613,7 @@
     },
     "package.json": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/package.json/-/package.json-2.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/package.json/-/package.json-2.0.1.tgz",
       "integrity": "sha1-+IYFnSpJ7QduZIg2ldc7K0bSHW0=",
       "requires": {
         "git-package-json": "^1.4.0",
@@ -8593,7 +8623,7 @@
       "dependencies": {
         "got": {
           "version": "5.7.1",
-          "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
+          "resolved": "http://registry.npmjs.org/got/-/got-5.7.1.tgz",
           "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
           "requires": {
             "create-error-class": "^3.0.1",
@@ -8615,7 +8645,7 @@
         },
         "package-json": {
           "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
+          "resolved": "http://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
           "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs=",
           "requires": {
             "got": "^5.0.0",
@@ -10506,15 +10536,6 @@
         "html-parse-stringify2": "2.0.1"
       }
     },
-    "react-image-lightbox": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/react-image-lightbox/-/react-image-lightbox-5.1.0.tgz",
-      "integrity": "sha512-R46QvffoDBscLQgTl4s3kFxVbnP7a+nIh7AXJNS0EXVeDaa6zKDKtIT+jFeEvs+F9oUHtZfenG1NHhTkO4hEOA==",
-      "requires": {
-        "prop-types": "^15.6.2",
-        "react-modal": "^3.6.1"
-      }
-    },
     "react-immutable-proptypes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/react-immutable-proptypes/-/react-immutable-proptypes-2.1.0.tgz",
@@ -10573,17 +10594,6 @@
         }
       }
     },
-    "react-modal": {
-      "version": "3.8.1",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.8.1.tgz",
-      "integrity": "sha512-aLKeZM9pgXpIKVwopRHMuvqKWiBajkqisDA8UzocdCF6S4fyKVfLWmZR5G1Q0ODBxxxxf2XIwiCP8G/11GJAuw==",
-      "requires": {
-        "exenv": "^1.2.0",
-        "prop-types": "^15.5.10",
-        "react-lifecycles-compat": "^3.0.0",
-        "warning": "^3.0.0"
-      }
-    },
     "react-moment": {
       "version": "0.7.9",
       "resolved": "https://registry.npmjs.org/react-moment/-/react-moment-0.7.9.tgz",

frontend/package.json

@@ -4,6 +4,7 @@
   "private": true,
   "dependencies": {
     "@reach/router": "^1.2.0",
+    "@seafile/react-image-lightbox": "0.0.1",
     "@seafile/resumablejs": "^1.1.15",
     "@seafile/seafile-calendar": "0.0.8",
     "@seafile/seafile-editor": "^0.2.84",
@@ -38,7 +39,6 @@
     "react-cookies": "^0.1.0",
     "react-dom": "^16.8.6",
     "react-i18next": "^10.12.2",
-    "react-image-lightbox": "^5.1.0",
     "react-mentions": "^3.0.2",
     "react-moment": "^0.7.9",
     "react-responsive": "^6.1.2",

frontend/src/components/dialog/image-dialog.js

@@ -2,8 +2,8 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { gettext } from '../../utils/constants';
 
-import Lightbox from 'react-image-lightbox';
+import Lightbox from '@seafile/react-image-lightbox';
-import 'react-image-lightbox/style.css';
+import '@seafile/react-image-lightbox/style.css';
 
 const propTypes = {
   imageItems: PropTypes.array.isRequired,