@plone/volto 16.22.0 → 16.22.1

package/package.json~

@@ -0,0 +1,444 @@
+{
+  "name": "@plone/volto",
+  "description": "Volto",
+  "maintainers": [
+    {
+      "name": "Plone Foundation",
+      "email": "plone-developers@lists.sourceforge.net",
+      "url": "http://plone.org"
+    }
+  ],
+  "license": "MIT",
+  "version": "17.0.0-alpha.23",
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:plone/volto.git"
+  },
+  "customizationPaths": [
+    "src/customizations/"
+  ],
+  "bugs": {
+    "url": "https://github.com/plone/volto/issues",
+    "email": "plone-developers@lists.sourceforge.net"
+  },
+  "homepage": "https://plone.org",
+  "keywords": [
+    "volto",
+    "plone",
+    "react"
+  ],
+  "packagesFolderAddons": {
+    "volto-slate": {
+      "package": "@plone/volto-slate"
+    }
+  },
+  "scripts": {
+    "postinstall": "make patches",
+    "analyze": "BUNDLE_ANALYZE=true razzle build",
+    "start": "razzle start",
+    "start:coresandbox": "ADDONS=coresandbox razzle start",
+    "build": "razzle build --noninteractive",
+    "prepare": "husky install",
+    "test": "razzle test --maxWorkers=50%",
+    "test:ci": "CI=true NODE_ICU_DATA=node_modules/full-icu razzle test",
+    "test:husky": "CI=true yarn test --bail --findRelatedTests",
+    "test:debug": "node --inspect node_modules/.bin/jest --runInBand",
+    "start:prod": "NODE_ENV=production node build/server.js",
+    "prettier": "./node_modules/.bin/prettier --single-quote --check 'src/**/*.{js,jsx,ts,tsx,json}'",
+    "prettier:fix": "./node_modules/.bin/prettier --single-quote --write 'src/**/*.{js,jsx,ts,tsx,json}'",
+    "stylelint": "./node_modules/.bin/stylelint 'theme/**/*.{css,less}' 'src/**/*.{css,less}'",
+    "stylelint:overrides": "./node_modules/.bin/stylelint 'theme/**/*.overrides' 'src/**/*.overrides'",
+    "stylelint:fix": "yarn stylelint --fix && yarn stylelint:overrides --fix",
+    "lint": "./node_modules/eslint/bin/eslint.js --max-warnings=0 'src/**/*.{js,jsx,json}'",
+    "lint:fix": "./node_modules/eslint/bin/eslint.js --fix 'src/**/*.{js,jsx,json}'",
+    "i18n": "rm -rf build/messages && NODE_ENV=production i18n",
+    "i18n:ci": "yarn i18n && git diff -G'^[^\"POT]' --exit-code",
+    "dry-release": "release-it --dry-run",
+    "release": "release-it",
+    "release-major-alpha": "release-it major --preRelease=alpha",
+    "release-alpha": "release-it --preRelease=alpha",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook"
+  },
+  "bundlewatch": {
+    "files": [
+      {
+        "path": "build/public/static/js/*.js",
+        "maxSize": "700kB"
+      }
+    ]
+  },
+  "jest": {
+    "modulePathIgnorePatterns": [
+      "api",
+      "packages"
+    ],
+    "transform": {
+      "^.+\\.js(x)?$": "babel-jest",
+      "^.+\\.(png)$": "jest-file",
+      "^.+\\.(jpg)$": "jest-file",
+      "^.+\\.(svg)$": "./jest-svgsystem-transform.js"
+    },
+    "moduleNameMapper": {
+      "@plone/volto/package.json": "<rootDir>/package.json",
+      "@plone/volto/babel": "<rootDir>/babel.js",
+      "@plone/volto/(.*)$": "<rootDir>/src/$1",
+      "@plone/volto-slate/(.*)$": "<rootDir>/packages/volto-slate/src/$1",
+      "~/config": "<rootDir>/src/config",
+      "~/../locales/${lang}.json": "<rootDir>/locales/en.json",
+      "(.*)/locales/(.*)": "<rootDir>/locales/$2",
+      "load-volto-addons": "<rootDir>/jest-addons-loader.js",
+      "@package/(.*)$": "<rootDir>/src/$1",
+      "@root/config": "<rootDir>/jest-addons-loader.js",
+      "@root/(.*)$": "<rootDir>/src/$1",
+      "@voltoconfig": "<rootDir>/jest-addons-loader.js",
+      "\\.(css|less|scss|sass)$": "identity-obj-proxy"
+    },
+    "coverageThreshold": {
+      "global": {
+        "branches": 10,
+        "functions": 10,
+        "lines": 10,
+        "statements": 10
+      }
+    },
+    "setupFiles": [
+      "./test-setup-globals.js",
+      "./test-setup-config.js"
+    ],
+    "globalSetup": "./global-test-setup.js",
+    "globals": {
+      "__DEV__": true
+    },
+    "testMatch": [
+      "<rootDir>/src/**/__tests__/**/*.{js,jsx,mjs}",
+      "<rootDir>/src/**/?(*.)(spec|test).{js,jsx,mjs}",
+      "<rootDir>/__tests__/**/?(*.)(spec|test).{js,jsx,mjs}",
+      "<rootDir>/packages/volto-slate/src/**/?(*.)(spec|test).{js,jsx,mjs}"
+    ]
+  },
+  "prettier": {
+    "trailingComma": "all",
+    "singleQuote": true,
+    "overrides": [
+      {
+        "files": "*.overrides",
+        "options": {
+          "parser": "less"
+        }
+      }
+    ]
+  },
+  "stylelint": {
+    "extends": [
+      "stylelint-config-idiomatic-order"
+    ],
+    "plugins": [
+      "stylelint-prettier"
+    ],
+    "overrides": [
+      {
+        "files": [
+          "**/*.scss"
+        ],
+        "customSyntax": "postcss-scss"
+      },
+      {
+        "files": [
+          "**/*.less"
+        ],
+        "customSyntax": "postcss-less"
+      },
+      {
+        "files": [
+          "**/*.overrides"
+        ],
+        "customSyntax": "postcss-less"
+      }
+    ],
+    "rules": {
+      "prettier/prettier": true,
+      "rule-empty-line-before": [
+        "always-multi-line",
+        {
+          "except": [
+            "first-nested"
+          ],
+          "ignore": [
+            "after-comment"
+          ]
+        }
+      ]
+    },
+    "ignoreFiles": "theme/themes/default/**/*.overrides"
+  },
+  "browserslist": [
+    ">1%",
+    "last 4 versions",
+    "Firefox ESR",
+    "not ie 11",
+    "not dead"
+  ],
+  "release-it": {
+    "hooks": {
+      "before:bump": [
+        "yarn i18n",
+        "git add locales"
+      ],
+      "after:bump": "pipx run towncrier build --draft --yes --version ${version} > .changelog.draft && pipx run towncrier build --yes --version ${version} && make corepackagebump VERSION=${version}",
+      "after:release": "rm .changelog.draft"
+    },
+    "git": {
+      "changelog": "pipx run towncrier build --draft --yes --version 0.0.0",
+      "requireUpstream": false,
+      "requireCleanWorkingDir": false
+    },
+    "github": {
+      "release": true,
+      "releaseName": "${version}",
+      "releaseNotes": "cat .changelog.draft"
+    }
+  },
+  "lint-staged": {
+    "src/**/*.{js,jsx,ts,tsx,json}": [
+      "npx eslint --max-warnings=0 --fix",
+      "npx prettier --single-quote --write",
+      "yarn test:husky"
+    ],
+    "src/**/*.{jsx}": [
+      "yarn i18n"
+    ],
+    "theme/**/*.{css,less}": [
+      "npx stylelint --fix"
+    ],
+    "src/**/*.{css,less}": [
+      "npx stylelint --fix"
+    ],
+    "theme/**/*.overrides": [
+      "npx stylelint --fix"
+    ],
+    "src/**/*.overrides": [
+      "npx stylelint --fix"
+    ]
+  },
+  "engines": {
+    "node": "^16 || ^18"
+  },
+  "dependencies": {
+    "@babel/core": "^7.0.0",
+    "@babel/plugin-proposal-export-default-from": "7.18.9",
+    "@babel/plugin-proposal-export-namespace-from": "7.18.9",
+    "@babel/plugin-proposal-json-strings": "7.18.6",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
+    "@babel/plugin-proposal-throw-expressions": "7.18.6",
+    "@babel/plugin-syntax-export-namespace-from": "7.8.3",
+    "@babel/runtime": "7.20.6",
+    "@babel/types": "7.20.5",
+    "@loadable/babel-plugin": "5.13.2",
+    "@loadable/component": "5.14.1",
+    "@loadable/server": "5.14.0",
+    "@loadable/webpack-plugin": "5.15.2",
+    "@plone/scripts": "2.1.2",
+    "@testing-library/cypress": "9.0.0",
+    "@testing-library/jest-dom": "5.16.4",
+    "@testing-library/react": "12.1.5",
+    "@testing-library/react-hooks": "8.0.1",
+    "autoprefixer": "10.4.8",
+    "axe-core": "4.4.2",
+    "babel-eslint": "10.1.0",
+    "babel-plugin-add-module-exports": "0.2.1",
+    "babel-plugin-lodash": "3.3.4",
+    "babel-plugin-react-intl": "5.1.17",
+    "babel-plugin-root-import": "6.1.0",
+    "babel-preset-razzle": "4.2.17",
+    "circular-dependency-plugin": "5.2.2",
+    "classnames": "2.2.6",
+    "commander": "8.2.0",
+    "connected-react-router": "6.8.0",
+    "crypto-random-string": "3.2.0",
+    "css-loader": "5.2.7",
+    "cypress": "12.17.1",
+    "cypress-axe": "1.4.0",
+    "cypress-file-upload": "5.0.8",
+    "debug": "4.3.2",
+    "decorate-component-with-props": "1.2.1",
+    "deep-freeze": "0.0.1",
+    "dependency-graph": "0.10.0",
+    "detect-browser": "5.1.0",
+    "diff": "3.5.0",
+    "draft-js": "0.10.5",
+    "draft-js-block-breakout-plugin": "2.0.1",
+    "draft-js-buttons": "2.0.2",
+    "draft-js-import-html": "1.4.1",
+    "draft-js-inline-toolbar-plugin": "2.0.3",
+    "draft-js-plugins-editor": "2.1.1",
+    "draft-js-plugins-utils": "2.0.3",
+    "draftjs-filters": "2.3.0",
+    "eslint": "6.8.0",
+    "eslint-config-airbnb": "18.1.0",
+    "eslint-config-prettier": "6.11.0",
+    "eslint-config-react-app": "5.2.1",
+    "eslint-import-resolver-alias": "1.1.2",
+    "eslint-import-resolver-babel-plugin-root-import": "1.1.1",
+    "eslint-plugin-flowtype": "4.7.0",
+    "eslint-plugin-import": "2.20.2",
+    "eslint-plugin-jsx-a11y": "6.2.3",
+    "eslint-plugin-prettier": "3.1.3",
+    "eslint-plugin-react": "7.20.0",
+    "eslint-plugin-react-hooks": "4.0.2",
+    "express": "4.17.3",
+    "filesize": "6",
+    "github-slugger": "1.4.0",
+    "glob": "7.1.6",
+    "history": "4.10.1",
+    "hoist-non-react-statics": "3.3.2",
+    "html-webpack-plugin": "5.5.0",
+    "http-proxy-middleware": "2.0.1",
+    "husky": "8.0.1",
+    "identity-obj-proxy": "3.0.0",
+    "image-extensions": "1.1.0",
+    "immutable": "3",
+    "is-hotkey": "0.2.0",
+    "is-url": "1.2.4",
+    "jest-file": "1.0.0",
+    "jotai": "2.0.3",
+    "jwt-decode": "2.2.0",
+    "less": "3.11.1",
+    "less-loader": "11.1.0",
+    "linkify-it": "3.0.2",
+    "lint-staged": "10.2.2",
+    "locale": "0.1.0",
+    "lodash": "4.17.21",
+    "lodash-move": "1.1.1",
+    "lodash-webpack-plugin": "0.11.6",
+    "mini-css-extract-plugin": "2.7.2",
+    "moment": "2.29.4",
+    "object-assign": "4.1.1",
+    "pofile": "1.0.10",
+    "postcss": "8.4.13",
+    "postcss-flexbugs-fixes": "5.0.2",
+    "postcss-less": "6.0.0",
+    "postcss-load-config": "3.1.4",
+    "postcss-loader": "7.0.2",
+    "postcss-overrides": "3.1.4",
+    "postcss-scss": "4.0.6",
+    "prepend-http": "2",
+    "prettier": "2.0.5",
+    "pretty-bytes": "5.3.0",
+    "prismjs": "1.27.0",
+    "promise-file-reader": "1.0.2",
+    "prop-types": "15.7.2",
+    "query-string": "7.1.0",
+    "razzle": "4.2.18",
+    "razzle-dev-utils": "4.2.18",
+    "razzle-plugin-bundle-analyzer": "4.2.18",
+    "razzle-plugin-scss": "4.2.18",
+    "rc-time-picker": "3.7.3",
+    "react": "17.0.2",
+    "react-anchor-link-smooth-scroll": "1.0.12",
+    "react-animate-height": "2.0.17",
+    "react-beautiful-dnd": "13.0.0",
+    "react-cookie": "4.1.1",
+    "react-dates": "21.5.1",
+    "react-detect-click-outside": "1.1.1",
+    "react-dnd": "5.0.0",
+    "react-dnd-html5-backend": "5.0.1",
+    "react-dom": "17.0.2",
+    "react-dropzone": "11.1.0",
+    "react-fast-compare": "2.0.4",
+    "react-image-gallery": "1.2.7",
+    "react-intersection-observer": "9.1.0",
+    "react-intl": "3.8.0",
+    "react-intl-redux": "2.2.0",
+    "react-medium-image-zoom": "3.0.15",
+    "react-portal": "4.2.1",
+    "react-redux": "7.2.4",
+    "react-router": "5.2.0",
+    "react-router-config": "5.1.1",
+    "react-router-dom": "5.2.0",
+    "react-router-hash-link": "2.4.3",
+    "react-select": "4.3.1",
+    "react-select-async-paginate": "0.5.3",
+    "react-share": "2.3.1",
+    "react-side-effect": "2.1.0",
+    "react-simple-code-editor": "0.7.1",
+    "react-sortable-hoc": "2.0.0",
+    "react-test-renderer": "17.0.2",
+    "react-toastify": "5.4.1",
+    "react-transition-group": "4.4.5",
+    "react-virtualized": "9.22.3",
+    "redraft": "0.10.2",
+    "redux": "4.1.0",
+    "redux-actions": "2.6.5",
+    "redux-connect": "10.0.0",
+    "redux-devtools-extension": "2.13.8",
+    "redux-localstorage-simple": "2.3.1",
+    "redux-mock-store": "1.5.4",
+    "redux-thunk": "2.3.0",
+    "rrule": "2.7.1",
+    "semantic-ui-less": "2.4.1",
+    "semantic-ui-react": "2.0.3",
+    "serialize-javascript": "3.1.0",
+    "slate": "0.84.0",
+    "slate-hyperscript": "0.81.3",
+    "slate-react": "0.83.2",
+    "start-server-and-test": "1.14.0",
+    "style-loader": "3.3.1",
+    "stylelint": "14.0.1",
+    "stylelint-config-idiomatic-order": "8.1.0",
+    "stylelint-config-prettier": "8.0.1",
+    "stylelint-prettier": "1.1.2",
+    "superagent": "3.8.2",
+    "svg-loader": "0.0.2",
+    "svgo-loader": "3.0.3",
+    "terser-webpack-plugin": "5.3.6",
+    "tlds": "1.203.1",
+    "undoo": "0.5.0",
+    "universal-cookie": "4.0.4",
+    "universal-cookie-express": "4.0.3",
+    "use-deep-compare-effect": "1.8.1",
+    "uuid": "^8.3.2",
+    "webpack": "5.76.1",
+    "webpack-dev-server": "4.11.1",
+    "webpack-node-externals": "3.0.0",
+    "xmlrpc": "1.3.2",
+    "yarnhook": "0.5.1"
+  },
+  "devDependencies": {
+    "@storybook/addon-actions": "^6.5.15",
+    "@storybook/addon-controls": "6.5.15",
+    "@storybook/addon-essentials": "^6.5.15",
+    "@storybook/addon-links": "^6.5.15",
+    "@storybook/builder-webpack5": "^6.5.15",
+    "@storybook/manager-webpack5": "^6.5.15",
+    "@storybook/react": "^6.5.15",
+    "babel-loader": "9.1.0",
+    "bundlewatch": "0.3.3",
+    "full-icu": "1.4.0",
+    "identity-obj-proxy": "3.0.0",
+    "jest": "26.6.3",
+    "jest-environment-jsdom": "^26",
+    "jsonwebtoken": "9.0.0",
+    "react-error-overlay": "6.0.9",
+    "react-is": "^16.13.1",
+    "release-it": "^16.1.3",
+    "semver": "^7.5.4",
+    "tmp": "0.2.1",
+    "use-trace-update": "1.3.2",
+    "why": "0.6.2"
+  },
+  "resolutions-comments": {
+    "ua-parser-js": "See https://github.com/faisalman/ua-parser-js/issues/536"
+  },
+  "resolutions": {
+    "clean-css": "5.3.1",
+    "http-proxy": "^1.18.1",
+    "react-dev-utils": "^12",
+    "react-error-overlay": "6.0.9",
+    "ua-parser-js": "0.7.28"
+  },
+  "volta": {
+    "node": "18.13.0"
+  },
+  "packageManager": "yarn@3.2.3"
+}

package/packages/volto-slate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plone/volto-slate",
-  "version": "16.22.0",
+  "version": "16.22.1",
   "description": "Slate.js integration with Volto",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/components/manage/Blocks/Image/schema.js

@@ -37,6 +37,10 @@ const messages = defineMessages({
     id: 'Alt text hint link text',
     defaultMessage: 'Describe the purpose of the image.',
   },
+  linkSettings: {
+    id: 'Link settings',
+    defaultMessage: 'Link settings',
+  },
 });
 
 export function ImageSchema({ formData, intl }) {
@@ -51,7 +55,7 @@ export function ImageSchema({ formData, intl }) {
         ? [
             {
               id: 'link_settings',
-              title: 'Link settings',
+              title: intl.formatMessage(messages.linkSettings),
               fields: ['href', 'openLinkInNewTab'],
             },
           ]

package/src/components/manage/Blocks/Search/components/SearchInput.jsx

@@ -13,7 +13,14 @@ const messages = defineMessages({
 });
 
 const SearchInput = (props) => {
-  const { data, searchText, setSearchText, isLive, onTriggerSearch } = props;
+  const {
+    data,
+    searchText,
+    setSearchText,
+    isLive,
+    onTriggerSearch,
+    removeSearchQuery,
+  } = props;
   const intl = useIntl();
 
   return (
@@ -44,7 +51,7 @@ const SearchInput = (props) => {
             className="search-input-clear-icon-button"
             onClick={() => {
               setSearchText('');
-              onTriggerSearch('');
+              removeSearchQuery();
             }}
           >
             <Icon name={clearSVG} />

package/src/components/manage/Blocks/Search/hocs/withSearch.jsx

@@ -301,7 +301,7 @@ const withSearch = (options) => (WrappedComponent) => {
               id,
               query: data.query || {},
               facets: toSearchFacets || facets,
-              searchText: toSearchText || searchText,
+              searchText: toSearchText ? toSearchText.trim() : '',
               sortOn: toSortOn || sortOn,
               sortOrder: toSortOrder || sortOrder,
               facetSettings,
@@ -329,6 +329,16 @@ const withSearch = (options) => (WrappedComponent) => {
       ],
     );
 
+    const removeSearchQuery = () => {
+      searchData.query = searchData.query.reduce(
+        // Remove SearchableText from query
+        (acc, kvp) => (kvp.i === 'SearchableText' ? acc : [...acc, kvp]),
+        [],
+      );
+      setSearchData(searchData);
+      setLocationSearchData(getSearchFields(searchData));
+    };
+
     const querystringResults = useSelector(
       (state) => state.querystringsearch.subrequests,
     );
@@ -347,6 +357,7 @@ const withSearch = (options) => (WrappedComponent) => {
         sortOrder={sortOrder}
         searchedText={urlSearchText}
         searchText={searchText}
+        removeSearchQuery={removeSearchQuery}
         setSearchText={setSearchText}
         onTriggerSearch={onTriggerSearch}
         totalItems={totalItems}

package/src/components/manage/Blocks/ToC/Schema.jsx

@@ -1,8 +1,37 @@
-const TableOfContentsSchema = ({ data }) => {
+import { defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+  toc: {
+    id: 'toc',
+    defaultMessage: 'Table of Contents',
+  },
+  Title: {
+    id: 'Title',
+    defaultMessage: 'Title',
+  },
+  HideTitle: {
+    id: 'Hide title',
+    defaultMessage: 'Hide title',
+  },
+  Entries: {
+    id: 'Entries',
+    defaultMessage: 'Entries',
+  },
+  Ordered: {
+    id: 'Ordered',
+    defaultMessage: 'Ordered',
+  },
+  Sticky: {
+    id: 'Sticky',
+    defaultMessage: 'Sticky',
+  },
+});
+
+const TableOfContentsSchema = ({ data, intl }) => {
   const { variation = 'default' } = data;
 
   return {
-    title: 'Table of Contents',
+    title: intl.formatMessage(messages.toc),
     fieldsets: [
       {
         id: 'default',
@@ -17,14 +46,14 @@ const TableOfContentsSchema = ({ data }) => {
     ],
     properties: {
       title: {
-        title: 'Block title',
+        title: intl.formatMessage(messages.Title),
       },
       hide_title: {
-        title: 'Hide title',
+        title: intl.formatMessage(messages.HideTitle),
         type: 'boolean',
       },
       levels: {
-        title: 'Entries',
+        title: intl.formatMessage(messages.Entries),
         isMulti: true,
         choices: [
           ['h1', 'h1'],
@@ -36,11 +65,11 @@ const TableOfContentsSchema = ({ data }) => {
         ],
       },
       ordered: {
-        title: 'Ordered',
+        title: intl.formatMessage(messages.Ordered),
         type: 'boolean',
       },
       sticky: {
-        title: 'Sticky',
+        title: intl.formatMessage(messages.Sticky),
         type: 'boolean',
       },
     },

package/src/components/manage/Contents/ContentsPropertiesModal.jsx

@@ -70,14 +70,6 @@ const messages = defineMessages({
     defaultMessage:
       'If selected, this item will not appear in the navigation tree',
   },
-  yes: {
-    id: 'Yes',
-    defaultMessage: 'Yes',
-  },
-  no: {
-    id: 'No',
-    defaultMessage: 'No',
-  },
 });
 
 /**
@@ -209,11 +201,7 @@ class ContentsPropertiesModal extends Component {
                 title: this.props.intl.formatMessage(
                   messages.excludeFromNavTitle,
                 ),
-                type: 'array',
-                choices: [
-                  [true, this.props.intl.formatMessage(messages.yes)],
-                  [false, this.props.intl.formatMessage(messages.no)],
-                ],
+                type: 'boolean',
               },
             },
             required: [],

package/src/components/manage/Controlpanels/Groups/RenderGroups.jsx

@@ -57,7 +57,7 @@ class RenderGroups extends Component {
    * @memberof UsersControlpanelUser
    */
   onChange(event, { value }) {
-    const [group, role] = value.split('.');
+    const [group, role] = value.split('&role=');
     this.props.updateGroups(group, role);
   }
 
@@ -97,7 +97,7 @@ class RenderGroups extends Component {
                     : this.props.group.roles.includes(role.id)
                 }
                 onChange={this.onChange}
-                value={`${this.props.group.id}.${role.id}`}
+                value={`${this.props.group.id}&role=${role.id}`}
               />
             )}
           </Table.Cell>

package/src/components/manage/Controlpanels/Users/RenderUsers.jsx

@@ -53,7 +53,7 @@ class RenderUsers extends Component {
    */
 
   onChange(event, { value }) {
-    const [user, role] = value.split('.');
+    const [user, role] = value.split('&role=');
     this.props.updateUser(user, role);
   }
   /**
@@ -83,7 +83,7 @@ class RenderUsers extends Component {
               <Checkbox
                 checked={this.props.user.roles.includes(role.id)}
                 onChange={this.onChange}
-                value={`${this.props.user.id}.${role.id}`}
+                value={`${this.props.user.id}&role=${role.id}`}
               />
             )}
           </Table.Cell>