cozy-sharing 28.2.0 → 28.3.0

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [28.3.0](https://github.com/cozy/cozy-libs/compare/cozy-sharing@28.2.1...cozy-sharing@28.3.0) (2026-01-26)
+
+### Features
+
+- Generate and copy folder link in one click ([7b806da](https://github.com/cozy/cozy-libs/commit/7b806dae2564c45d1a469150832ebed3ac47235a))
+
+## [28.2.1](https://github.com/cozy/cozy-libs/compare/cozy-sharing@28.2.0...cozy-sharing@28.2.1) (2026-01-15)
+
+**Note:** Version bump only for package cozy-sharing
+
 # [28.2.0](https://github.com/cozy/cozy-libs/compare/cozy-sharing@28.1.4...cozy-sharing@28.2.0) (2026-01-14)
 
 ### Features

package/dist/components/ShareByLink.js

@@ -2,8 +2,9 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import PropTypes from 'prop-types';
-import React, { useReducer } from 'react';
+import React, { useReducer, useState } from 'react';
 import { useI18n } from 'twake-i18n';
+import { useClient } from 'cozy-client';
 import Button from 'cozy-ui/transpiled/react/Buttons';
 import Icon from 'cozy-ui/transpiled/react/Icon';
 import CopyIcon from 'cozy-ui/transpiled/react/Icons/Copy';
@@ -11,9 +12,12 @@ import LinkIcon from 'cozy-ui/transpiled/react/Icons/Link';
 import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert';
 import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints';
 import { ShareRestrictionModal } from './ShareRestrictionModal/ShareRestrictionModal';
-import { copyToClipboard } from './ShareRestrictionModal/helpers';
+import { copyToClipboard, createSharingLink } from './ShareRestrictionModal/helpers';
+import { useSharingContext } from '../hooks/useSharingContext';
 
 var ShareByLink = function ShareByLink(_ref) {
+  var _navigator;
+
   var link = _ref.link,
       document = _ref.document,
       documentType = _ref.documentType;
@@ -27,8 +31,19 @@ var ShareByLink = function ShareByLink(_ref) {
   var _useAlert = useAlert(),
       showAlert = _useAlert.showAlert;
 
-  var showCopyAndSendButtons = link && isMobile && navigator.share;
-  var showOnlyCopyButton = link && !isMobile || link && isMobile && !navigator.share;
+  var client = useClient();
+
+  var _useSharingContext = useSharingContext(),
+      shareByLink = _useSharingContext.shareByLink;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isGenerating = _useState2[0],
+      setIsGenerating = _useState2[1];
+
+  var canShare = typeof ((_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.share) === 'function';
+  var showCopyAndSendButtons = isMobile && canShare;
+  var showOnlyCopyButton = !isMobile || !canShare;
 
   var _useReducer = useReducer(function (state) {
     return !state;
@@ -37,55 +52,158 @@ var ShareByLink = function ShareByLink(_ref) {
       isEditDialogOpen = _useReducer2[0],
       toggleEditDialogOpen = _useReducer2[1];
 
-  var copyLinkToClipboard = /*#__PURE__*/function () {
+  var handleGenerateLink = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            _context.next = 2;
-            return copyToClipboard(link, {
+            setIsGenerating(true);
+            _context.prev = 1;
+            _context.next = 4;
+            return createSharingLink({
+              client: client,
+              file: document,
+              documentType: documentType,
+              shareByLink: shareByLink,
               t: t,
-              showAlert: showAlert
+              showAlert: showAlert,
+              password: '',
+              ttl: undefined,
+              editingRights: 'readOnly'
             });
 
-          case 2:
+          case 4:
+            return _context.abrupt("return", _context.sent);
+
+          case 7:
+            _context.prev = 7;
+            _context.t0 = _context["catch"](1);
+            return _context.abrupt("return", null);
+
+          case 10:
+            _context.prev = 10;
+            setIsGenerating(false);
+            return _context.finish(10);
+
+          case 13:
           case "end":
             return _context.stop();
         }
-      }, _callee);
+      }, _callee, null, [[1, 7, 10, 13]]);
     }));
 
-    return function copyLinkToClipboard() {
+    return function handleGenerateLink() {
       return _ref2.apply(this, arguments);
     };
   }();
 
-  var shareLink = /*#__PURE__*/function () {
+  var generateLinkAndCopyLinkToClipboard = /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-      var shareData;
+      var linkToCopy;
       return _regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            _context2.prev = 0;
+            linkToCopy = link;
+
+            if (linkToCopy) {
+              _context2.next = 5;
+              break;
+            }
+
+            _context2.next = 4;
+            return handleGenerateLink();
+
+          case 4:
+            linkToCopy = _context2.sent;
+
+          case 5:
+            if (!linkToCopy) {
+              _context2.next = 10;
+              break;
+            }
+
+            _context2.next = 8;
+            return copyToClipboard(linkToCopy, {
+              t: t,
+              showAlert: showAlert
+            });
+
+          case 8:
+            _context2.next = 11;
+            break;
+
+          case 10:
+            showAlert({
+              message: t("".concat(documentType, ".share.error.generic")),
+              severity: 'error',
+              variant: 'filled'
+            });
+
+          case 11:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+
+    return function generateLinkAndCopyLinkToClipboard() {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+
+  var shareLink = /*#__PURE__*/function () {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+      var linkToShare, shareData;
+      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            linkToShare = link;
+
+            if (linkToShare) {
+              _context3.next = 5;
+              break;
+            }
+
+            _context3.next = 4;
+            return handleGenerateLink();
+
+          case 4:
+            linkToShare = _context3.sent;
+
+          case 5:
+            if (linkToShare) {
+              _context3.next = 8;
+              break;
+            }
+
+            showAlert({
+              message: t("".concat(documentType, ".share.error.generic")),
+              severity: 'error',
+              variant: 'filled'
+            });
+            return _context3.abrupt("return");
+
+          case 8:
+            _context3.prev = 8;
             shareData = {
               text: t("".concat(documentType, ".share.shareByLink.shareDescription"), {
                 name: document.name || ''
               }),
-              url: link
+              url: linkToShare
             };
-            _context2.next = 4;
+            _context3.next = 12;
             return navigator.share(shareData);
 
-          case 4:
-            _context2.next = 9;
+          case 12:
+            _context3.next = 17;
             break;
 
-          case 6:
-            _context2.prev = 6;
-            _context2.t0 = _context2["catch"](0);
+          case 14:
+            _context3.prev = 14;
+            _context3.t0 = _context3["catch"](8);
 
             // Don't show error when user cancels the share dialog
-            if (_context2.t0.name !== 'AbortError') {
+            if (_context3.t0.name !== 'AbortError') {
               showAlert({
                 message: t("".concat(documentType, ".share.error.generic")),
                 severity: 'error',
@@ -93,34 +211,21 @@ var ShareByLink = function ShareByLink(_ref) {
               });
             }
 
-          case 9:
+          case 17:
           case "end":
-            return _context2.stop();
+            return _context3.stop();
         }
-      }, _callee2, null, [[0, 6]]);
+      }, _callee3, null, [[8, 14]]);
     }));
 
     return function shareLink() {
-      return _ref3.apply(this, arguments);
+      return _ref4.apply(this, arguments);
     };
   }();
 
   return /*#__PURE__*/React.createElement("div", {
     className: "u-w-100 u-flex u-flex-justify-center"
-  }, !link && /*#__PURE__*/React.createElement(Button, {
-    label: t("".concat(documentType, ".share.shareByLink.create")),
-    variant: "secondary",
-    size: "medium",
-    startIcon: /*#__PURE__*/React.createElement(Icon, {
-      icon: LinkIcon
-    }),
-    className: "u-flex-auto",
-    style: {
-      position: 'initial'
-    } // fix z-index bug on iOS when under a BottomDrawer due to relative position
-    ,
-    onClick: toggleEditDialogOpen
-  }), showCopyAndSendButtons && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+  }, showCopyAndSendButtons && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
     label: t("".concat(documentType, ".share.shareByLink.send")),
     variant: "secondary",
     size: "medium",
@@ -128,14 +233,16 @@ var ShareByLink = function ShareByLink(_ref) {
       icon: LinkIcon
     }),
     className: "u-flex-auto u-mr-half",
-    onClick: shareLink
+    onClick: shareLink,
+    busy: isGenerating
   }), /*#__PURE__*/React.createElement(Button, {
     label: /*#__PURE__*/React.createElement(Icon, {
       icon: CopyIcon
     }),
     variant: "secondary",
     size: "medium",
-    onClick: copyLinkToClipboard
+    onClick: generateLinkAndCopyLinkToClipboard,
+    disabled: isGenerating
   })), showOnlyCopyButton && /*#__PURE__*/React.createElement(Button, {
     label: t("".concat(documentType, ".share.shareByLink.copy")),
     variant: "secondary",
@@ -144,7 +251,8 @@ var ShareByLink = function ShareByLink(_ref) {
       icon: LinkIcon
     }),
     className: "u-flex-auto u-mr-half",
-    onClick: copyLinkToClipboard
+    onClick: generateLinkAndCopyLinkToClipboard,
+    busy: isGenerating
   }), isEditDialogOpen && /*#__PURE__*/React.createElement(ShareRestrictionModal, {
     file: document,
     onClose: toggleEditDialogOpen

package/dist/components/ShareRestrictionModal/helpers.js

@@ -1,9 +1,82 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { generateWebLink } from 'cozy-client';
 import minilog from 'cozy-minilog';
+import { getAppSlugFromDocumentType } from '../../helpers/link';
 var log = minilog('ShareRestrictionModal/helpers');
 export var WRITE_PERMS = ['GET', 'POST', 'PUT', 'PATCH'];
 export var READ_ONLY_PERMS = ['GET'];
+/**
+ * Create a sharing link for a file with specified options
+ * @param {object} options
+ * @param {object} options.client - CozyClient instance
+ * @param {object} options.file - File to share
+ * @param {string} options.documentType - Type of the document
+ * @param {Function} options.shareByLink - Function to create permissions
+ * @param {Function} options.t - Translation function
+ * @param {Function} options.showAlert - Function to display an alert
+ * @param {Date|string} [options.ttl] - Time to live of the sharing link
+ * @param {'readOnly'|'write'} [options.editingRights] - Editing rights
+ * @param {string} [options.password] - Password
+ * @param {boolean} [options.withTTL] - Whether to add a default TTL
+ * @returns {Promise<string|null>} - The generated web link or null if permissions creation fails
+ */
+
+export var createSharingLink = /*#__PURE__*/function () {
+  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref) {
+    var _permsResult$data;
+
+    var client, file, documentType, shareByLink, t, ttl, _ref$editingRights, editingRights, password, showAlert, permsResult, perms;
+
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          client = _ref.client, file = _ref.file, documentType = _ref.documentType, shareByLink = _ref.shareByLink, t = _ref.t, ttl = _ref.ttl, _ref$editingRights = _ref.editingRights, editingRights = _ref$editingRights === void 0 ? 'readOnly' : _ref$editingRights, password = _ref.password, showAlert = _ref.showAlert;
+          _context.next = 3;
+          return createPermissions({
+            file: file,
+            t: t,
+            ttl: ttl,
+            editingRights: editingRights,
+            password: password,
+            documentType: documentType,
+            shareByLink: shareByLink,
+            showAlert: showAlert
+          });
+
+        case 3:
+          permsResult = _context.sent;
+
+          if (permsResult !== null && permsResult !== void 0 && (_permsResult$data = permsResult.data) !== null && _permsResult$data !== void 0 && (_permsResult$data = _permsResult$data.attributes) !== null && _permsResult$data !== void 0 && (_permsResult$data = _permsResult$data.shortcodes) !== null && _permsResult$data !== void 0 && _permsResult$data.code) {
+            _context.next = 6;
+            break;
+          }
+
+          return _context.abrupt("return", null);
+
+        case 6:
+          perms = permsResult.data;
+          return _context.abrupt("return", generateWebLink({
+            cozyUrl: client.getStackClient().uri,
+            searchParams: [['sharecode', perms.attributes.shortcodes.code]],
+            pathname: '/public',
+            slug: getAppSlugFromDocumentType({
+              documentType: documentType
+            }),
+            subDomainType: client.capabilities.flat_subdomains ? 'flat' : 'nested'
+          }));
+
+        case 8:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+
+  return function createSharingLink(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();
 /**
  * Copy a string to the clipboard
  *
@@ -14,27 +87,27 @@ export var READ_ONLY_PERMS = ['GET'];
  */
 
 export var copyToClipboard = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(value) {
-    var _ref2,
+  var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(value) {
+    var _ref4,
         t,
         showAlert,
-        _args = arguments;
+        _args2 = arguments;
 
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          _ref2 = _args.length > 1 && _args[1] !== undefined ? _args[1] : {}, t = _ref2.t, showAlert = _ref2.showAlert;
+          _ref4 = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : {}, t = _ref4.t, showAlert = _ref4.showAlert;
 
           if (value) {
-            _context.next = 3;
+            _context2.next = 3;
             break;
           }
 
-          return _context.abrupt("return", false);
+          return _context2.abrupt("return", false);
 
         case 3:
-          _context.prev = 3;
-          _context.next = 6;
+          _context2.prev = 3;
+          _context2.next = 6;
           return navigator.clipboard.writeText(value);
 
         case 6:
@@ -43,28 +116,28 @@ export var copyToClipboard = /*#__PURE__*/function () {
             severity: 'success',
             variant: 'filled'
           });
-          _context.next = 13;
+          _context2.next = 13;
           break;
 
         case 9:
-          _context.prev = 9;
-          _context.t0 = _context["catch"](3);
+          _context2.prev = 9;
+          _context2.t0 = _context2["catch"](3);
           showAlert({
             message: t('copyReminderContent.error'),
             severity: 'error',
             variant: 'filled'
           });
-          log.error("Error in 'copyToClipboard' function when trying to copy to clipboard", _context.t0);
+          log.error("Error in 'copyToClipboard' function when trying to copy to clipboard", _context2.t0);
 
         case 13:
         case "end":
-          return _context.stop();
+          return _context2.stop();
       }
-    }, _callee, null, [[3, 9]]);
+    }, _callee2, null, [[3, 9]]);
   }));
 
-  return function copyToClipboard(_x) {
-    return _ref.apply(this, arguments);
+  return function copyToClipboard(_x2) {
+    return _ref3.apply(this, arguments);
   };
 }();
 /**
@@ -115,39 +188,39 @@ export var makeTTL = function makeTTL(selectedDate) {
  */
 
 export var createPermissions = /*#__PURE__*/function () {
-  var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(_ref3) {
+  var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(_ref5) {
     var file, t, ttl, password, editingRights, documentType, shareByLink, showAlert, verbs;
-    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
+    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+      while (1) switch (_context3.prev = _context3.next) {
         case 0:
-          file = _ref3.file, t = _ref3.t, ttl = _ref3.ttl, password = _ref3.password, editingRights = _ref3.editingRights, documentType = _ref3.documentType, shareByLink = _ref3.shareByLink, showAlert = _ref3.showAlert;
-          _context2.prev = 1;
+          file = _ref5.file, t = _ref5.t, ttl = _ref5.ttl, password = _ref5.password, editingRights = _ref5.editingRights, documentType = _ref5.documentType, shareByLink = _ref5.shareByLink, showAlert = _ref5.showAlert;
+          _context3.prev = 1;
           verbs = editingRights === 'readOnly' ? READ_ONLY_PERMS : WRITE_PERMS;
-          return _context2.abrupt("return", shareByLink(file, {
+          return _context3.abrupt("return", shareByLink(file, {
             verbs: verbs,
             ttl: ttl,
             password: password
           }));
 
         case 6:
-          _context2.prev = 6;
-          _context2.t0 = _context2["catch"](1);
+          _context3.prev = 6;
+          _context3.t0 = _context3["catch"](1);
           showAlert({
             message: t("".concat(documentType, ".share.shareByLink.permserror")),
             severity: 'error',
             variant: 'filled'
           });
-          log.error("Error in 'readOnlyPermissionLink' function when trying to change permission", _context2.t0);
+          log.error("Error in 'readOnlyPermissionLink' function when trying to change permission", _context3.t0);
 
         case 10:
         case "end":
-          return _context2.stop();
+          return _context3.stop();
       }
-    }, _callee2, null, [[1, 6]]);
+    }, _callee3, null, [[1, 6]]);
   }));
 
-  return function createPermissions(_x2) {
-    return _ref4.apply(this, arguments);
+  return function createPermissions(_x3) {
+    return _ref6.apply(this, arguments);
   };
 }();
 /**
@@ -166,41 +239,41 @@ export var createPermissions = /*#__PURE__*/function () {
  */
 
 export var updatePermissions = /*#__PURE__*/function () {
-  var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(_ref5) {
+  var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(_ref7) {
     var file, t, dateToggle, selectedDate, passwordToggle, password, editingRights, documentType, updateDocumentPermissions, showAlert, expiresAt, ensurePassword, verbs;
-    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
+    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+      while (1) switch (_context4.prev = _context4.next) {
         case 0:
-          file = _ref5.file, t = _ref5.t, dateToggle = _ref5.dateToggle, selectedDate = _ref5.selectedDate, passwordToggle = _ref5.passwordToggle, password = _ref5.password, editingRights = _ref5.editingRights, documentType = _ref5.documentType, updateDocumentPermissions = _ref5.updateDocumentPermissions, showAlert = _ref5.showAlert;
-          _context3.prev = 1;
+          file = _ref7.file, t = _ref7.t, dateToggle = _ref7.dateToggle, selectedDate = _ref7.selectedDate, passwordToggle = _ref7.passwordToggle, password = _ref7.password, editingRights = _ref7.editingRights, documentType = _ref7.documentType, updateDocumentPermissions = _ref7.updateDocumentPermissions, showAlert = _ref7.showAlert;
+          _context4.prev = 1;
           expiresAt = dateToggle ? (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.toISOString()) || undefined : '';
           ensurePassword = passwordToggle ? password || undefined : '';
           verbs = editingRights === 'readOnly' ? READ_ONLY_PERMS : WRITE_PERMS;
-          return _context3.abrupt("return", updateDocumentPermissions(file, {
+          return _context4.abrupt("return", updateDocumentPermissions(file, {
             verbs: verbs,
             expiresAt: expiresAt,
             password: ensurePassword
           }));
 
         case 8:
-          _context3.prev = 8;
-          _context3.t0 = _context3["catch"](1);
+          _context4.prev = 8;
+          _context4.t0 = _context4["catch"](1);
           showAlert({
             message: t("".concat(documentType, ".share.shareByLink.permserror")),
             severity: 'error',
             variant: 'filled'
           });
-          log.error("Error in 'updateDocumentPermissions' function when trying to change permission", _context3.t0);
+          log.error("Error in 'updateDocumentPermissions' function when trying to change permission", _context4.t0);
 
         case 12:
         case "end":
-          return _context3.stop();
+          return _context4.stop();
       }
-    }, _callee3, null, [[1, 8]]);
+    }, _callee4, null, [[1, 8]]);
   }));
 
-  return function updatePermissions(_x3) {
-    return _ref6.apply(this, arguments);
+  return function updatePermissions(_x4) {
+    return _ref8.apply(this, arguments);
   };
 }();
 /**
@@ -214,33 +287,33 @@ export var updatePermissions = /*#__PURE__*/function () {
  */
 
 export var revokePermissions = /*#__PURE__*/function () {
-  var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(_ref7) {
+  var _ref10 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(_ref9) {
     var file, t, documentType, revokeSharingLink, showAlert;
-    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) switch (_context4.prev = _context4.next) {
+    return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
         case 0:
-          file = _ref7.file, t = _ref7.t, documentType = _ref7.documentType, revokeSharingLink = _ref7.revokeSharingLink, showAlert = _ref7.showAlert;
-          _context4.prev = 1;
-          return _context4.abrupt("return", revokeSharingLink(file));
+          file = _ref9.file, t = _ref9.t, documentType = _ref9.documentType, revokeSharingLink = _ref9.revokeSharingLink, showAlert = _ref9.showAlert;
+          _context5.prev = 1;
+          return _context5.abrupt("return", revokeSharingLink(file));
 
         case 5:
-          _context4.prev = 5;
-          _context4.t0 = _context4["catch"](1);
+          _context5.prev = 5;
+          _context5.t0 = _context5["catch"](1);
           showAlert({
             message: t("".concat(documentType, ".share.error.revoke")),
             severity: 'error',
             variant: 'filled'
           });
-          log.error("Error in 'revokePermissions' function when trying to revoke sharing link", _context4.t0);
+          log.error("Error in 'revokePermissions' function when trying to revoke sharing link", _context5.t0);
 
         case 9:
         case "end":
-          return _context4.stop();
+          return _context5.stop();
       }
-    }, _callee4, null, [[1, 5]]);
+    }, _callee5, null, [[1, 5]]);
   }));
 
-  return function revokePermissions(_x4) {
-    return _ref8.apply(this, arguments);
+  return function revokePermissions(_x5) {
+    return _ref10.apply(this, arguments);
   };
 }();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-sharing",
-  "version": "28.2.0",
+  "version": "28.3.0",
   "description": "Provides sharing login for React applications.",
   "main": "dist/index.js",
   "author": "Cozy",
@@ -59,7 +59,7 @@
     "cozy-intent": "^2.30.1",
     "cozy-minilog": "^3.10.0",
     "cozy-ui": "^135.0.0",
-    "cozy-ui-plus": "^4.3.0",
+    "cozy-ui-plus": "^4.4.0",
     "jest": "26.6.3",
     "jest-environment-jsdom": "26.6.2",
     "react": "16.12.0",
@@ -83,5 +83,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "ab4b92d67cde105ce9d2c17693c6fe2245e77627"
+  "gitHead": "5257ba90033080856ea9c08920e8007fcc8a027c"
 }

package/src/components/ShareByLink.jsx

@@ -1,7 +1,8 @@
 import PropTypes from 'prop-types'
-import React, { useReducer } from 'react'
+import React, { useReducer, useState } from 'react'
 import { useI18n } from 'twake-i18n'
 
+import { useClient } from 'cozy-client'
 import Button from 'cozy-ui/transpiled/react/Buttons'
 import Icon from 'cozy-ui/transpiled/react/Icon'
 import CopyIcon from 'cozy-ui/transpiled/react/Icons/Copy'
@@ -10,33 +11,86 @@ import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
 import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
 
 import { ShareRestrictionModal } from './ShareRestrictionModal/ShareRestrictionModal'
-import { copyToClipboard } from './ShareRestrictionModal/helpers'
+import {
+  copyToClipboard,
+  createSharingLink
+} from './ShareRestrictionModal/helpers'
+import { useSharingContext } from '../hooks/useSharingContext'
 
 const ShareByLink = ({ link, document, documentType }) => {
   const { t } = useI18n()
   const { isMobile } = useBreakpoints()
   const { showAlert } = useAlert()
+  const client = useClient()
+  const { shareByLink } = useSharingContext()
+  const [isGenerating, setIsGenerating] = useState(false)
 
-  const showCopyAndSendButtons = link && isMobile && navigator.share
-  const showOnlyCopyButton =
-    (link && !isMobile) || (link && isMobile && !navigator.share)
+  const canShare = typeof navigator?.share === 'function'
+  const showCopyAndSendButtons = isMobile && canShare
+  const showOnlyCopyButton = !isMobile || !canShare
 
   const [isEditDialogOpen, toggleEditDialogOpen] = useReducer(
     state => !state,
     false
   )
 
-  const copyLinkToClipboard = async () => {
-    await copyToClipboard(link, { t, showAlert })
+  const handleGenerateLink = async () => {
+    setIsGenerating(true)
+    try {
+      return await createSharingLink({
+        client,
+        file: document,
+        documentType,
+        shareByLink,
+        t,
+        showAlert,
+        password: '',
+        ttl: undefined,
+        editingRights: 'readOnly'
+      })
+    } catch (error) {
+      return null
+    } finally {
+      setIsGenerating(false)
+    }
+  }
+
+  const generateLinkAndCopyLinkToClipboard = async () => {
+    let linkToCopy = link
+    if (!linkToCopy) {
+      linkToCopy = await handleGenerateLink()
+    }
+    if (linkToCopy) {
+      await copyToClipboard(linkToCopy, { t, showAlert })
+    } else {
+      showAlert({
+        message: t(`${documentType}.share.error.generic`),
+        severity: 'error',
+        variant: 'filled'
+      })
+    }
   }
 
   const shareLink = async () => {
+    let linkToShare = link
+    if (!linkToShare) {
+      linkToShare = await handleGenerateLink()
+    }
+    if (!linkToShare) {
+      showAlert({
+        message: t(`${documentType}.share.error.generic`),
+        severity: 'error',
+        variant: 'filled'
+      })
+      return
+    }
+
     try {
       const shareData = {
         text: t(`${documentType}.share.shareByLink.shareDescription`, {
           name: document.name || ''
         }),
-        url: link
+        url: linkToShare
       }
       await navigator.share(shareData)
     } catch (error) {
@@ -53,17 +107,6 @@ const ShareByLink = ({ link, document, documentType }) => {
 
   return (
     <div className="u-w-100 u-flex u-flex-justify-center">
-      {!link && (
-        <Button
-          label={t(`${documentType}.share.shareByLink.create`)}
-          variant="secondary"
-          size="medium"
-          startIcon={<Icon icon={LinkIcon} />}
-          className="u-flex-auto"
-          style={{ position: 'initial' }} // fix z-index bug on iOS when under a BottomDrawer due to relative position
-          onClick={toggleEditDialogOpen}
-        />
-      )}
       {showCopyAndSendButtons && (
         <>
           <Button
@@ -73,12 +116,14 @@ const ShareByLink = ({ link, document, documentType }) => {
             startIcon={<Icon icon={LinkIcon} />}
             className="u-flex-auto u-mr-half"
             onClick={shareLink}
+            busy={isGenerating}
           />
           <Button
             label={<Icon icon={CopyIcon} />}
             variant="secondary"
             size="medium"
-            onClick={copyLinkToClipboard}
+            onClick={generateLinkAndCopyLinkToClipboard}
+            disabled={isGenerating}
           />
         </>
       )}
@@ -89,7 +134,8 @@ const ShareByLink = ({ link, document, documentType }) => {
           size="medium"
           startIcon={<Icon icon={LinkIcon} />}
           className="u-flex-auto u-mr-half"
-          onClick={copyLinkToClipboard}
+          onClick={generateLinkAndCopyLinkToClipboard}
+          busy={isGenerating}
         />
       )}
       {isEditDialogOpen && (

package/src/components/ShareRestrictionModal/helpers.js

@@ -1,10 +1,62 @@
+import { generateWebLink } from 'cozy-client'
 import minilog from 'cozy-minilog'
 
+import { getAppSlugFromDocumentType } from '../../helpers/link'
+
 const log = minilog('ShareRestrictionModal/helpers')
 
 export const WRITE_PERMS = ['GET', 'POST', 'PUT', 'PATCH']
 export const READ_ONLY_PERMS = ['GET']
 
+/**
+ * Create a sharing link for a file with specified options
+ * @param {object} options
+ * @param {object} options.client - CozyClient instance
+ * @param {object} options.file - File to share
+ * @param {string} options.documentType - Type of the document
+ * @param {Function} options.shareByLink - Function to create permissions
+ * @param {Function} options.t - Translation function
+ * @param {Function} options.showAlert - Function to display an alert
+ * @param {Date|string} [options.ttl] - Time to live of the sharing link
+ * @param {'readOnly'|'write'} [options.editingRights] - Editing rights
+ * @param {string} [options.password] - Password
+ * @param {boolean} [options.withTTL] - Whether to add a default TTL
+ * @returns {Promise<string|null>} - The generated web link or null if permissions creation fails
+ */
+export const createSharingLink = async ({
+  client,
+  file,
+  documentType,
+  shareByLink,
+  t,
+  ttl,
+  editingRights = 'readOnly',
+  password,
+  showAlert
+}) => {
+  const permsResult = await createPermissions({
+    file,
+    t,
+    ttl,
+    editingRights,
+    password,
+    documentType,
+    shareByLink,
+    showAlert
+  })
+  if (!permsResult?.data?.attributes?.shortcodes?.code) {
+    return null
+  }
+  const { data: perms } = permsResult
+  return generateWebLink({
+    cozyUrl: client.getStackClient().uri,
+    searchParams: [['sharecode', perms.attributes.shortcodes.code]],
+    pathname: '/public',
+    slug: getAppSlugFromDocumentType({ documentType }),
+    subDomainType: client.capabilities.flat_subdomains ? 'flat' : 'nested'
+  })
+}
+
 /**
  * Copy a string to the clipboard
  *