@atlaskit/smart-hooks 0.0.2

package/dist/types/types.d.ts

@@ -0,0 +1,91 @@
+import type { UserSearchProductAttributes, UserSearchQuery } from '@atlaskit/smart-common';
+export declare type UseUserRecommendationsProps = {
+    /**
+     * Base url override for downstream APIs.
+     * Note: there is a trend for browsers blocking cookies for cross-site resources.
+     * This prop is added for legacy reasons and will likely be removed in the future.
+     * https://webkit.org/blog/10218/full-third-party-cookie-blocking-and-more/
+     */
+    baseUrl?: string;
+    /**
+     * Context information for analytics. Eg: if the hook was consumed inside a ticket's comment, the childObjectId would be
+     *  the ID of the comment and the ticket would be the objectId. Optional, but please provide if available.
+     */
+    childObjectId?: string;
+    /**
+     * The container Id to identify context. e.g. Jira: projectId. Confluence: spaceId. Bitbucket: repositoryId.
+     */
+    containerId?: string;
+    /**
+     * Time to debounce the suggestions fetching (in milliseconds). Defaults to 150ms.
+     */
+    debounceTimeMs?: number;
+    /**
+     * Identifier for informing the server on what experience the hook is powering.
+     * The server uses the fieldId to determine which model to utilize when
+     * generating suggestions.
+     * All fieldId's will be bucketed into a model that provides generic smart results,
+     * except "assignee", "mentions" which are specifically trained for Jira Assignee and
+     * @Mentions. For specifically trained models, please contact #help-smart-experiences.
+     */
+    fieldId: string;
+    /**
+     * Whether to include users in the result set  (@default: true).
+     */
+    includeUsers?: boolean;
+    /**
+     * Whether to include groups in the resultset (@default: false).
+     */
+    includeGroups?: boolean;
+    /**
+     * Whether to include teams in the resultset  (@default: false).
+     */
+    includeTeams?: boolean;
+    /**
+     *  (@default: 25)
+     */
+    maxNumberOfResults?: number;
+    /**
+     * An identifier of the closest context object, e.g. issueId, pageId, pullRequestId.
+     * Used for analytics. Optional, but please include if available.
+     */
+    objectId?: string;
+    /**
+     * Preload the list of suggested users with an empty-query ('') search as soon as
+     * the hook is used.
+     * WARNING: please consider carefully before deciding to preload your suggestions
+     * as this will increase the load on the recommendations services (has caused HOTs).
+     * Please give #help-smart-experiences a ballpark on the expected request volume.
+     * (@default: false)
+     */
+    preload?: boolean;
+    /**
+     * AAID of the user interacting with the component.
+     * If not provided, server will extract principalId from the context header, assuming that the user is logged in
+     * when making the request. (@default: “context”)
+     */
+    principalId?: string;
+    /**
+     * Product-specific Attributes - you should pass in the attribute type that matches your current SupportedProduct.
+     * Currently we support additional attributes (BitbucketAttributes) for bitbucket and (ConfluenceAttributes) for Confluence.
+     */
+    productAttributes?: UserSearchProductAttributes;
+    /**
+     * Product identifier. If you are an NPF, please ensure your product has been onboarded with
+     * Cross-product user-search @see https://developer.atlassian.com/cloud/cross-product-user-search/
+     * If you are still waiting for CPUS, you can use the `people` productKey in the interim.
+     */
+    productKey: string;
+    /**
+     * Pass-through for CPUS. Refer to @see https://developer.atlassian.com/cloud/cross-product-user-search/rest/api-group-search/#api-group-search
+     * for detailed docs on parameters.
+     */
+    cpusSearchQuery?: UserSearchQuery;
+    /**
+     * Identifier for the product's tenant, also known as siteId or cloudId.
+     * If product is not tenanted, the convention is to provide the productKey
+     * as the tenantId (e.g. "bitbucket") but this may vary across products.
+     * Check with #help-smart-experiences.
+     */
+    tenantId: string;
+};

package/dist/types/utils/transform-recommendations-to-options/index.d.ts

@@ -0,0 +1,5 @@
+import { IntlShape } from 'react-intl-next';
+import { UserSearchItem } from '@atlaskit/smart-common';
+import { OptionData } from '@atlaskit/user-picker';
+declare const _default: (recommendations: UserSearchItem[], intl: IntlShape) => OptionData[];
+export default _default;

package/example-helpers/mock-urs-data.ts

@@ -0,0 +1,82 @@
+export const userSampleAvatarUrl =
+  'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAASABIAAD/2wCEAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRQBAwQEBQQFCQUFCRQNCw0UFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFP/AABEIACAAIAMBIgACEQEDEQH/xAB1AAEAAwEAAAAAAAAAAAAAAAAHAgUGCBAAAQMCBQMDAgcAAAAAAAAAAQIDBAURAAYSIUEHEzEUImEVcSMyQlGBweEBAAMBAAAAAAAAAAAAAAAAAAMEBwURAAICAgMBAQEAAAAAAAAAAAECAxEABBIhIkExgf/aAAwDAQACEQMRAD8AxWVci1ipwmJdT7seKFbIMgLKrGxTYkkH4NsMH1D0UFwsqsAACom1zbxvje9QMoU6BVnnFPswkqBX71JQkj7nnBFmwNx6JJmw5zUtkKUlCmFhaCAkG+21/IxCZ2keQ2KA6/uWzyF5X2cs1T1To62n3jYoWUuDfyLf3gUzhl/MuUI06fDLjdMBGh5EtCyQogBOm2q9+L+MJ1Ep0p1SFd5lptwqSe6sJCRpBvvySQP4xoqZlFt6QluQ4iSUL1eQQP8AcG1pHieqsHFHcVyv8xB6l0hnNOUrzGPUKlsBBXYa0FJ/MkkEbEA253GB/I/SeH0wy1PocFtoU6pOeqbbUjthp3TY8nyPngbADHT1ejCi02LGaShx6GlJKFH2rPlV/ub4H85yI+bSqPGdRSZjThdbYeSUNlRFlAnwQfixGNTZn4zSRq3hjdYprRK0cbyD2ABeBHULpiOo8ymrluBNMpai4lgoU5+MFg6zpULWtbkEXww5Ey/EpFOhoYQtllsDVqPudI5V9/OI0ZNMyahuI4tqsy/euykak90nlXgC9hsNv3xd0xuTMImylLaSE3S3+kE8cYHJslwsQbyvzADXRHaSuz9z/9k=';
+
+export const mockUserSearchData = [
+  {
+    id: '2234',
+    avatarUrl: userSampleAvatarUrl,
+    name: 'Jack Sparrow',
+    mentionName: 'captainjack',
+    lozenge: 'teammate',
+    accessLevel: 'SITE',
+    presence: {
+      status: 'offline',
+    },
+  },
+  {
+    id: '27',
+    avatarUrl: userSampleAvatarUrl,
+    name: 'Jean Luc Picard',
+    mentionName: 'makeitso',
+    lozenge: 'teammate',
+    accessLevel: 'APPLICATION',
+    presence: {
+      status: 'none',
+      time: '1:57am',
+    },
+  },
+  {
+    id: '1701',
+    avatarUrl: userSampleAvatarUrl,
+    name: 'James T. Kirk',
+    mentionName: 'wheresmyshirt',
+    nickname: 'jim',
+    accessLevel: 'NONE',
+    presence: {
+      status: 'focus',
+    },
+  },
+  {
+    id: '12312412',
+    name:
+      "Dude with long name and time that doesn't seem to stop and should overflow",
+    mentionName:
+      "Dudewithlongnamethatdoesn'tseemtostopandshouldoverflowwithtime",
+    presence: {
+      time: '1:57pm',
+    },
+  },
+  {
+    id: '12312428',
+    avatarUrl: userSampleAvatarUrl,
+    name: 'Monkey Trousers',
+    lozenge: 'TEAM',
+    mentionName: 'Monkey Trousers',
+  },
+  {
+    id: '12312594',
+    avatarUrl:
+      'https://ptc-directory-sited-static.us-east-1.prod.public.atl-paas.net/teams/avatars/0.svg',
+    name: 'The Cool Cats',
+    userType: 'TEAM',
+    context: {
+      members: [],
+      includesYou: false,
+      memberCount: 10,
+      teamLink: 'someLink',
+    },
+  },
+  {
+    id: '12312597',
+    avatarUrl:
+      'https://ptc-directory-sited-static.us-east-1.prod.public.atl-paas.net/teams/avatars/3.svg',
+    name: 'The whole company',
+    userType: 'TEAM',
+    context: {
+      members: [],
+      includesYou: true,
+      memberCount: 80,
+      teamLink: 'someLink',
+    },
+  },
+];

package/example-helpers/use-endpoint-mocks.ts

@@ -0,0 +1,47 @@
+import { useEffect } from 'react';
+
+import fetchMock from 'fetch-mock/cjs/client';
+
+import { EntityType, UserSearchResponse } from '@atlaskit/smart-common';
+
+import { mockUserSearchData } from './mock-urs-data';
+
+const mockEndpoints = () => {
+  // http://www.wheresrhys.co.uk/fetch-mock/#usageconfiguration
+  // Unmatched routes will fallback to the network
+  fetchMock.config.fallbackToNetwork = true;
+
+  const userRecommendationsResponse = (): UserSearchResponse => {
+    return {
+      recommendedUsers: mockUserSearchData
+        .filter(() => Math.random() < 0.7)
+        .map(({ id, name, avatarUrl = '', nickname }) => ({
+          entityType: EntityType.USER,
+          id,
+          name,
+          avatarUrl,
+          nickname,
+        })),
+      errors: [],
+    };
+  };
+
+  fetchMock.mock(
+    {
+      functionMatcher: (url: string) => {
+        return url === '/gateway/api/v1/recommendations';
+      },
+    },
+    () => userRecommendationsResponse(),
+    { method: 'POST', overwriteRoutes: false },
+  );
+};
+
+// Simple hook for using inside example pages, which sets up the mock API responses, and then
+// un-sets the mock API responses when the example is exited.
+export const useEndpointMocks = () => {
+  useEffect(() => {
+    mockEndpoints();
+    return () => fetchMock.reset();
+  }, []);
+};

package/package.json

@@ -0,0 +1,81 @@
+{
+  "name": "@atlaskit/smart-hooks",
+  "version": "0.0.2",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "author": "Atlassian Pty Ltd",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "module:es2019": "dist/es2019/index.js",
+  "types": "dist/types/index.d.ts",
+  "sideEffects": false,
+  "atlaskit:src": "src/index.ts",
+  "atlassian": {
+    "team": "Search & Smarts: Smart Experience",
+    "inPublicMirror": false,
+    "releaseModel": "continuous"
+  },
+  "dependencies": {
+    "@atlaskit/smart-common": "^0.0.2",
+    "@atlaskit/user-picker": "^8.3.0",
+    "@babel/runtime": "^7.0.0",
+    "lodash": "^4.17.21"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0",
+    "react-intl-next": "npm:react-intl@^5.18.1"
+  },
+  "devDependencies": {
+    "@atlaskit/analytics-gas-types": "^5.0.0",
+    "@atlaskit/analytics-listeners": "^8.0.0",
+    "@atlaskit/analytics-next": "^8.2.0",
+    "@atlaskit/analytics-viewer": "^0.4.5",
+    "@atlaskit/button": "^16.0.0",
+    "@atlaskit/docs": "*",
+    "@atlaskit/smart-hooks": "*",
+    "@atlaskit/ssr": "*",
+    "@atlaskit/textfield": "^5.0.5",
+    "@atlaskit/visual-regression": "*",
+    "@atlaskit/webdriver-runner": "*",
+    "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@atlassiansox/analytics-web-client": "^4.2.0",
+    "@storybook/addon-knobs": "^5.3.18",
+    "@testing-library/react": "^8.0.1",
+    "@testing-library/react-hooks": "^1.0.4",
+    "enzyme": "^3.10.0",
+    "fetch-mock": "^8.0.0",
+    "react-dom": "^16.8.0",
+    "typescript": "3.9.6",
+    "wait-for-expect": "^1.2.0"
+  },
+  "techstack": {
+    "@atlassian/frontend": {
+      "import-structure": [
+        "atlassian-conventions"
+      ],
+      "circular-dependencies": [
+        "file-and-folder-level"
+      ]
+    },
+    "@repo/internal": {
+      "analytics": [
+        "analytics-next"
+      ],
+      "theming": [
+        "react-context"
+      ],
+      "ui-components": [
+        "lite-mode"
+      ],
+      "deprecation": [
+        "no-deprecated-imports"
+      ]
+    }
+  },
+  "af:exports": {
+    ".": "./src/index.ts"
+  },
+  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
+}