@atlaskit/link-datasource 0.23.0 → 0.24.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/link-datasource
 
+## 0.24.0
+
+### Minor Changes
+
+- [`108aa0ad121`](https://bitbucket.org/atlassian/atlassian-frontend/commits/108aa0ad121) - [ux] Fix some table bugs such as inconsistency between issue count for modal/table and fix case where user can deselect all fields in the column picker
+
 ## 0.23.0
 
 ### Minor Changes

package/dist/cjs/ui/issue-like-table/column-picker/index.js

@@ -87,6 +87,13 @@ var ColumnPicker = function ColumnPicker(_ref) {
     onOpen && void onOpen();
     void sortSelectedColumnsTop();
   }, [onOpen, sortSelectedColumnsTop]);
+
+  // If only 1 option is selected, disable it since we don't want user to uncheck everything
+  var handleIsOptionDisabled = function handleIsOptionDisabled(option, selectValue) {
+    return selectValue.length === 1 && selectValue.some(function (selectedValue) {
+      return selectedValue.value === option.value;
+    });
+  };
   return (0, _react2.jsx)(_select.PopupSelect, {
     classNamePrefix: 'column-picker-popup',
     testId: 'column-picker-popup',
@@ -99,6 +106,7 @@ var ColumnPicker = function ColumnPicker(_ref) {
     closeMenuOnSelect: false,
     hideSelectedOptions: false,
     isMulti: true,
+    isOptionDisabled: handleIsOptionDisabled,
     placeholder: intl.formatMessage(_messages.columnPickerMessages.search),
     onKeyDown: stopEscapePropagationWhenOpen,
     "aria-label": "Search for fields",

package/dist/cjs/ui/jira-issues-modal/modal/index.js

@@ -299,8 +299,8 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   }, (0, _react2.jsx)(_reactIntlNext.FormattedNumber, {
     value: totalCount
   }), ' ', (0, _react2.jsx)(_reactIntlNext.FormattedPlural, {
-    one: "issue",
-    other: "issues",
+    one: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.modalMessages.singularIssue),
+    other: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.modalMessages.pluralIssues),
     value: totalCount
   })), (0, _react2.jsx)(_standardButton.default, {
     appearance: "default",

package/dist/cjs/ui/jira-issues-modal/modal/messages.js

@@ -37,9 +37,19 @@ var modalMessages = (0, _reactIntlNext.defineMessages)({
     defaultMessage: 'Count view'
   },
   issuesCountSmartCardPlaceholderText: {
-    id: 'linkDataSource.jira-issues.configmodal.issues',
+    id: 'linkDataSource.jira-issues.configmodal.placeholder.issues',
     description: 'Placeholder text that will be placed next to a count of jira issues',
     defaultMessage: '### Issues'
+  },
+  singularIssue: {
+    id: 'linkDataSource.jira-issues.configmodal.singular.issue',
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.jira-issues.configmodal.plural.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   }
 });
 exports.modalMessages = modalMessages;

package/dist/cjs/ui/table-footer/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TableFooter = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("react");
@@ -46,12 +45,14 @@ var TableFooter = function TableFooter(_ref) {
     "data-testid": "table-footer"
   }, (0, _react2.jsx)(IssueCounterWrapper, null, showIssueCount && (0, _react2.jsx)(_heading.default, {
     testId: "issue-count",
-    level: 'h400'
-  }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.footerMessages.issueText, {
-    values: {
-      issueCount: issueCount
-    }
-  })))), (0, _react2.jsx)(SyncWrapper, null, onRefresh && (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(SyncTextWrapper, {
+    level: "h400"
+  }, (0, _react2.jsx)(_reactIntlNext.FormattedNumber, {
+    value: issueCount
+  }), ' ', (0, _react2.jsx)(_reactIntlNext.FormattedPlural, {
+    one: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.footerMessages.singularIssue),
+    other: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.footerMessages.pluralIssues),
+    value: issueCount
+  }))), (0, _react2.jsx)(SyncWrapper, null, onRefresh && (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(SyncTextWrapper, {
     "data-testid": "sync-text"
   }, isLoading ? (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.footerMessages.loadingText) : (0, _react2.jsx)(_syncInfo.SyncInfo, {
     lastSyncTime: lastSyncTime

package/dist/cjs/ui/table-footer/messages.js

@@ -6,10 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.footerMessages = void 0;
 var _reactIntlNext = require("react-intl-next");
 var footerMessages = (0, _reactIntlNext.defineMessages)({
-  issueText: {
+  singularIssue: {
     id: 'linkDataSource.table-footer.issue',
-    description: 'Text that appears after issue count number if there is only 1 issue.',
-    defaultMessage: '{issueCount} {issueCount, plural, one {issue} other {issues}}'
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.table-footer.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   },
   loadingText: {
     id: 'linkDataSource.table-footer.loading',

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.23.0",
+	"version": "0.24.0",
 	"sideEffects": false
 }

package/dist/es2019/ui/issue-like-table/column-picker/index.js

@@ -64,6 +64,11 @@ export const ColumnPicker = ({
     onOpen && void onOpen();
     void sortSelectedColumnsTop();
   }, [onOpen, sortSelectedColumnsTop]);
+
+  // If only 1 option is selected, disable it since we don't want user to uncheck everything
+  const handleIsOptionDisabled = (option, selectValue) => {
+    return selectValue.length === 1 && selectValue.some(selectedValue => selectedValue.value === option.value);
+  };
   return jsx(PopupSelect, {
     classNamePrefix: 'column-picker-popup',
     testId: 'column-picker-popup',
@@ -76,6 +81,7 @@ export const ColumnPicker = ({
     closeMenuOnSelect: false,
     hideSelectedOptions: false,
     isMulti: true,
+    isOptionDisabled: handleIsOptionDisabled,
     placeholder: intl.formatMessage(columnPickerMessages.search),
     onKeyDown: stopEscapePropagationWhenOpen,
     "aria-label": "Search for fields",

package/dist/es2019/ui/jira-issues-modal/modal/index.js

@@ -248,8 +248,8 @@ export const JiraIssuesConfigModal = props => {
   }, jsx(FormattedNumber, {
     value: totalCount
   }), ' ', jsx(FormattedPlural, {
-    one: "issue",
-    other: "issues",
+    one: jsx(FormattedMessage, modalMessages.singularIssue),
+    other: jsx(FormattedMessage, modalMessages.pluralIssues),
     value: totalCount
   })), jsx(Button, {
     appearance: "default",

package/dist/es2019/ui/jira-issues-modal/modal/messages.js

@@ -31,8 +31,18 @@ export const modalMessages = defineMessages({
     defaultMessage: 'Count view'
   },
   issuesCountSmartCardPlaceholderText: {
-    id: 'linkDataSource.jira-issues.configmodal.issues',
+    id: 'linkDataSource.jira-issues.configmodal.placeholder.issues',
     description: 'Placeholder text that will be placed next to a count of jira issues',
     defaultMessage: '### Issues'
+  },
+  singularIssue: {
+    id: 'linkDataSource.jira-issues.configmodal.singular.issue',
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.jira-issues.configmodal.plural.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   }
 });

package/dist/es2019/ui/table-footer/index.js

@@ -1,9 +1,8 @@
-import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
 import { Fragment, useEffect, useState } from 'react';
 import { jsx } from '@emotion/react';
 import styled from '@emotion/styled';
-import { FormattedMessage, useIntl } from 'react-intl-next';
+import { FormattedMessage, FormattedNumber, FormattedPlural, useIntl } from 'react-intl-next';
 import Button from '@atlaskit/button';
 import Heading from '@atlaskit/heading';
 import RefreshIcon from '@atlaskit/icon/glyph/refresh';
@@ -57,12 +56,14 @@ export const TableFooter = ({
     "data-testid": "table-footer"
   }, jsx(IssueCounterWrapper, null, showIssueCount && jsx(Heading, {
     testId: "issue-count",
-    level: 'h400'
-  }, jsx(FormattedMessage, _extends({}, footerMessages.issueText, {
-    values: {
-      issueCount
-    }
-  })))), jsx(SyncWrapper, null, onRefresh && jsx(Fragment, null, jsx(SyncTextWrapper, {
+    level: "h400"
+  }, jsx(FormattedNumber, {
+    value: issueCount
+  }), ' ', jsx(FormattedPlural, {
+    one: jsx(FormattedMessage, footerMessages.singularIssue),
+    other: jsx(FormattedMessage, footerMessages.pluralIssues),
+    value: issueCount
+  }))), jsx(SyncWrapper, null, onRefresh && jsx(Fragment, null, jsx(SyncTextWrapper, {
     "data-testid": "sync-text"
   }, isLoading ? jsx(FormattedMessage, footerMessages.loadingText) : jsx(SyncInfo, {
     lastSyncTime: lastSyncTime

package/dist/es2019/ui/table-footer/messages.js

@@ -1,9 +1,14 @@
 import { defineMessages } from 'react-intl-next';
 export const footerMessages = defineMessages({
-  issueText: {
+  singularIssue: {
     id: 'linkDataSource.table-footer.issue',
-    description: 'Text that appears after issue count number if there is only 1 issue.',
-    defaultMessage: '{issueCount} {issueCount, plural, one {issue} other {issues}}'
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.table-footer.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   },
   loadingText: {
     id: 'linkDataSource.table-footer.loading',

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.23.0",
+	"version": "0.24.0",
 	"sideEffects": false
 }

package/dist/esm/ui/issue-like-table/column-picker/index.js

@@ -80,6 +80,13 @@ export var ColumnPicker = function ColumnPicker(_ref) {
     onOpen && void onOpen();
     void sortSelectedColumnsTop();
   }, [onOpen, sortSelectedColumnsTop]);
+
+  // If only 1 option is selected, disable it since we don't want user to uncheck everything
+  var handleIsOptionDisabled = function handleIsOptionDisabled(option, selectValue) {
+    return selectValue.length === 1 && selectValue.some(function (selectedValue) {
+      return selectedValue.value === option.value;
+    });
+  };
   return jsx(PopupSelect, {
     classNamePrefix: 'column-picker-popup',
     testId: 'column-picker-popup',
@@ -92,6 +99,7 @@ export var ColumnPicker = function ColumnPicker(_ref) {
     closeMenuOnSelect: false,
     hideSelectedOptions: false,
     isMulti: true,
+    isOptionDisabled: handleIsOptionDisabled,
     placeholder: intl.formatMessage(columnPickerMessages.search),
     onKeyDown: stopEscapePropagationWhenOpen,
     "aria-label": "Search for fields",

package/dist/esm/ui/jira-issues-modal/modal/index.js

@@ -288,8 +288,8 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   }, jsx(FormattedNumber, {
     value: totalCount
   }), ' ', jsx(FormattedPlural, {
-    one: "issue",
-    other: "issues",
+    one: jsx(FormattedMessage, modalMessages.singularIssue),
+    other: jsx(FormattedMessage, modalMessages.pluralIssues),
     value: totalCount
   })), jsx(Button, {
     appearance: "default",

package/dist/esm/ui/jira-issues-modal/modal/messages.js

@@ -31,8 +31,18 @@ export var modalMessages = defineMessages({
     defaultMessage: 'Count view'
   },
   issuesCountSmartCardPlaceholderText: {
-    id: 'linkDataSource.jira-issues.configmodal.issues',
+    id: 'linkDataSource.jira-issues.configmodal.placeholder.issues',
     description: 'Placeholder text that will be placed next to a count of jira issues',
     defaultMessage: '### Issues'
+  },
+  singularIssue: {
+    id: 'linkDataSource.jira-issues.configmodal.singular.issue',
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.jira-issues.configmodal.plural.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   }
 });

package/dist/esm/ui/table-footer/index.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
@@ -6,7 +5,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 import { Fragment, useEffect, useState } from 'react';
 import { jsx } from '@emotion/react';
 import styled from '@emotion/styled';
-import { FormattedMessage, useIntl } from 'react-intl-next';
+import { FormattedMessage, FormattedNumber, FormattedPlural, useIntl } from 'react-intl-next';
 import Button from '@atlaskit/button';
 import Heading from '@atlaskit/heading';
 import RefreshIcon from '@atlaskit/icon/glyph/refresh';
@@ -39,12 +38,14 @@ export var TableFooter = function TableFooter(_ref) {
     "data-testid": "table-footer"
   }, jsx(IssueCounterWrapper, null, showIssueCount && jsx(Heading, {
     testId: "issue-count",
-    level: 'h400'
-  }, jsx(FormattedMessage, _extends({}, footerMessages.issueText, {
-    values: {
-      issueCount: issueCount
-    }
-  })))), jsx(SyncWrapper, null, onRefresh && jsx(Fragment, null, jsx(SyncTextWrapper, {
+    level: "h400"
+  }, jsx(FormattedNumber, {
+    value: issueCount
+  }), ' ', jsx(FormattedPlural, {
+    one: jsx(FormattedMessage, footerMessages.singularIssue),
+    other: jsx(FormattedMessage, footerMessages.pluralIssues),
+    value: issueCount
+  }))), jsx(SyncWrapper, null, onRefresh && jsx(Fragment, null, jsx(SyncTextWrapper, {
     "data-testid": "sync-text"
   }, isLoading ? jsx(FormattedMessage, footerMessages.loadingText) : jsx(SyncInfo, {
     lastSyncTime: lastSyncTime

package/dist/esm/ui/table-footer/messages.js

@@ -1,9 +1,14 @@
 import { defineMessages } from 'react-intl-next';
 export var footerMessages = defineMessages({
-  issueText: {
+  singularIssue: {
     id: 'linkDataSource.table-footer.issue',
-    description: 'Text that appears after issue count number if there is only 1 issue.',
-    defaultMessage: '{issueCount} {issueCount, plural, one {issue} other {issues}}'
+    description: 'Text that appears after single issue count number.',
+    defaultMessage: 'issue'
+  },
+  pluralIssues: {
+    id: 'linkDataSource.table-footer.issues',
+    description: 'Text that appears after plural issue count number.',
+    defaultMessage: 'issues'
   },
   loadingText: {
     id: 'linkDataSource.table-footer.loading',

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.23.0",
+	"version": "0.24.0",
 	"sideEffects": false
 }

package/dist/types/ui/jira-issues-modal/modal/messages.d.ts

@@ -34,4 +34,14 @@ export declare const modalMessages: {
         description: string;
         defaultMessage: string;
     };
+    singularIssue: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    pluralIssues: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
 };

package/dist/types/ui/table-footer/messages.d.ts

@@ -1,5 +1,10 @@
 export declare const footerMessages: {
-    issueText: {
+    singularIssue: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    pluralIssues: {
         id: string;
         description: string;
         defaultMessage: string;

package/dist/types-ts4.5/ui/jira-issues-modal/modal/messages.d.ts

@@ -34,4 +34,14 @@ export declare const modalMessages: {
         description: string;
         defaultMessage: string;
     };
+    singularIssue: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    pluralIssues: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
 };

package/dist/types-ts4.5/ui/table-footer/messages.d.ts

@@ -1,5 +1,10 @@
 export declare const footerMessages: {
-    issueText: {
+    singularIssue: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    pluralIssues: {
         id: string;
         description: string;
         defaultMessage: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"