@pega/cosmos-react-demos 5.0.0-dev.4.8 → 5.0.0-dev.5.0

package/jsx/work/ArticleList/ArticleList.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArticleList.stories.jsx","sourceRoot":"","sources":["../../../src/work/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useState, useRef } from 'react';\nimport type { MouseEvent } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Action,\n  createUID,\n  menuHelpers,\n  MenuItemProps,\n  MenuProps,\n  registerIcon,\n  SearchInputProps,\n  escapeRegExp\n} from '@pega/cosmos-react-core';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport * as bookOpen from '@pega/cosmos-react-core/lib/components/Icon/icons/book-open.icon';\nimport {\n  ArticleList,\n  ArticleSummary,\n  ArticleListFilter,\n  ArticleSummaryProps,\n  Articles,\n  QuickFilter\n} from '@pega/cosmos-react-work';\n\nimport { suggestedMock, followedMock, searchMock } from './ArticleList.mocks';\n\nexport default {\n  title: 'Work/ArticleList',\n  component: ArticleList,\n  subcomponents: { ArticleSummary, ArticleListFilter },\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\nregisterIcon(thumbsUpSolidIcon, thumbsDownSolidIcon, bookOpen);\n\ninterface ArticleListDemoProps {\n  isSuggestArticleAction: boolean;\n  showAction: boolean;\n  showHeader: boolean;\n  showHeaderIcon: boolean;\n  showQuickFilters: boolean;\n  showCount: boolean;\n  showResults: boolean;\n  showLoadMore: boolean;\n}\n\ntype MockArticles = ArticleSummaryProps & {\n  isLiked: boolean;\n  isFollowed: boolean;\n};\n\nexport const ArticleListDemo: StoryFn<ArticleListDemoProps> = (args: ArticleListDemoProps) => {\n  const [searchVal, setSearchVal] = useState('');\n  const [activeTab, setActiveTab] = useState('Suggested');\n  const [loading, setLoading] = useState(false);\n  const [categoryList, setCategoryList] = useState<MenuProps['items']>([]);\n  const [sortBy, setSortBy] = useState<MenuProps['items']>([]);\n  const [articles, setArticles] = useState<ArticleSummaryProps[]>([]);\n  const [quickFilters, setQuickFilters] = useState<QuickFilter[]>([]);\n  const [loadingMore, isSetLoadMore] = useState(false);\n  const [hasMore, setHasMore] = useState(true);\n  const [filterCategoryValue, setFilterCategoryValue] = useState('');\n  const [categoryId, setCategoryId] = useState<{ id: string; value: boolean }>({\n    id: '',\n    value: false\n  });\n  const comboboxRef = useRef<HTMLDivElement>(null);\n  const selectedSortByOption = useMemo(() => menuHelpers.getSelected(sortBy)[0], [sortBy]);\n\n  const selectSortByOption = useCallback((id: MenuItemProps['id']) => {\n    setSortBy(cur => menuHelpers.selectItem(cur, id, 'single-select'));\n  }, []);\n\n  const selectedCategory = useMemo(() => {\n    return menuHelpers.getSelected(categoryList).map(item => ({ text: item.primary, id: item.id }));\n  }, [categoryList]);\n\n  const categoryListToRender = useMemo(() => {\n    return menuHelpers.mapTree(categoryList, item => ({\n      ...item,\n      selected: !!item.selected\n    }));\n  }, [categoryList]);\n\n  const toggleItem = (id: MenuItemProps['id']) => {\n    setCategoryList(cur => menuHelpers.toggleSelected(cur, id, 'multi-select'));\n  };\n\n  const onReaction: Required<ArticleSummaryProps>['feedback']['onReaction'] = (\n    articleId,\n    reaction\n  ) => {\n    setArticles(prevArticles => {\n      const itemIndex = prevArticles.findIndex(article => article?.articleId === articleId);\n      const updatedData = [...prevArticles];\n      if (itemIndex !== -1) {\n        const currentItemFeedback = updatedData[itemIndex].feedback;\n        if (currentItemFeedback) {\n          const likeValue = currentItemFeedback?.likes || 0;\n          const dislikeValue = currentItemFeedback?.dislikes || 0;\n\n          if (!reaction) {\n            if (currentItemFeedback.reaction === 'liked') {\n              currentItemFeedback.likes = likeValue - 1;\n            } else {\n              currentItemFeedback.dislikes = dislikeValue - 1;\n            }\n            currentItemFeedback.reaction = undefined;\n          }\n\n          if (reaction === 'liked') {\n            if (currentItemFeedback?.reaction === 'disliked') {\n              currentItemFeedback.dislikes = dislikeValue - 1;\n            }\n\n            currentItemFeedback.likes = likeValue + 1;\n            currentItemFeedback.reaction = 'liked';\n          }\n\n          if (reaction === 'disliked') {\n            if (currentItemFeedback.reaction === 'liked') {\n              currentItemFeedback.likes = likeValue - 1;\n            }\n            currentItemFeedback.dislikes = dislikeValue + 1;\n            currentItemFeedback.reaction = 'disliked';\n          }\n        }\n      }\n\n      return updatedData;\n    });\n  };\n\n  const removeCategoryItem = (id: MenuItemProps['id']) => {\n    setCategoryId(prev => {\n      return {\n        id: prev.id,\n        value: prev.id === id ? false : prev.value\n      };\n    });\n    setCategoryList(cur => menuHelpers.toggleSelected(cur, id, 'multi-select'));\n  };\n  const updateArticles = (mockArticles: MockArticles[]) => {\n    const data = Object.values(mockArticles);\n    return data.map(\n      ({\n        isLiked = false,\n        isFollowed = false,\n        articleId = '',\n        title,\n        href = '/',\n        abstract,\n        meta,\n        feedback,\n        quickFilters: quickFilterTags\n      }) => {\n        const actionObj = [{ id: '1', text: 'Edit' }];\n        if (isLiked) {\n          actionObj.push({ id: '3', text: 'Dislike' });\n        } else {\n          actionObj.push({ id: '3', text: 'Like' });\n        }\n        if (isFollowed) {\n          actionObj.push({ id: '4', text: 'Unfollow' });\n        } else {\n          actionObj.push({ id: '4', text: 'Follow' });\n        }\n\n        return {\n          articleId,\n          href,\n          title,\n          abstract,\n          onTitleClick: (id?: string, e?: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n            e?.preventDefault();\n          },\n          primaryActions: actionObj,\n          meta,\n          feedback,\n          quickFilters:\n            args.showQuickFilters && quickFilterTags?.length\n              ? quickFilterTags?.map(({ id, name }) => {\n                  return {\n                    id,\n                    name\n                  };\n                })\n              : []\n        };\n      }\n    );\n  };\n\n  const fetchArticleContent: (activeTabName: string) => Promise<{\n    articles: ArticleSummaryProps[];\n    category: MenuProps['items'];\n    sortBy: MenuProps['items'];\n  }> = activeTabName => {\n    return new Promise(resolve => {\n      let activeTabContent: any = null;\n\n      if (!activeTabName || activeTabName === 'Search') activeTabContent = { ...searchMock };\n      else if (activeTabName === 'Suggested') activeTabContent = { ...suggestedMock };\n      else if (activeTabName === 'Followed') activeTabContent = { ...followedMock };\n\n      setTimeout(() => {\n        if (activeTabContent) {\n          resolve({\n            articles: updateArticles(activeTabContent.articles),\n            category: activeTabContent.category || [],\n            sortBy: activeTabContent.sortBy || []\n          });\n        }\n      }, 500);\n    });\n  };\n\n  const handleCategoryClick = (id: string) => {\n    setArticles([]);\n    setCategoryId({\n      id,\n      value: true\n    });\n    setLoading(true);\n    fetchArticleContent('Search').then(res => {\n      const filteredArticles = res.articles.filter(item => item.meta?.category?.id === id);\n      setArticles(filteredArticles);\n      setCategoryList(res.category);\n      toggleItem(id);\n      setSortBy(res.sortBy);\n      setLoading(false);\n      if (comboboxRef.current) {\n        comboboxRef.current.querySelector('input')?.focus();\n      }\n    });\n    setActiveTab('Search');\n    setSearchVal('');\n    if (id !== 'Search') {\n      setQuickFilters([]);\n    }\n  };\n\n  searchMock.articles = searchMock.articles.map(article => {\n    return {\n      ...article,\n      meta: {\n        ...article.meta,\n        category: {\n          ...article.meta.category,\n          onClick: handleCategoryClick\n        }\n      },\n      feedback: {\n        ...article.feedback,\n        id: article.articleId,\n        onReaction\n      }\n    };\n  });\n\n  suggestedMock.articles = suggestedMock.articles.map(article => {\n    return {\n      ...article,\n      meta: {\n        ...article.meta,\n        category: {\n          ...article.meta.category,\n          onClick: handleCategoryClick\n        }\n      },\n      feedback: {\n        ...article.feedback,\n        id: article.articleId,\n        onReaction\n      }\n    };\n  });\n\n  followedMock.articles = followedMock.articles.map(article => {\n    return {\n      ...article,\n      meta: {\n        ...article.meta,\n        category: {\n          ...article.meta.category,\n          onClick: handleCategoryClick\n        }\n      },\n      feedback: {\n        ...article.feedback,\n        id: article.articleId,\n        onReaction\n      }\n    };\n  });\n\n  const handleTabChange = (id: string) => {\n    setArticles([]);\n    setCategoryList([]);\n    setLoading(true);\n    fetchArticleContent(id).then(res => {\n      setArticles(res.articles);\n      setCategoryList(res.category);\n      setSortBy(res.sortBy);\n      setLoading(false);\n    });\n\n    setActiveTab(id);\n    setSearchVal('');\n    if (id !== 'Search') {\n      setQuickFilters([]);\n    }\n  };\n\n  useEffect(() => {\n    fetchArticleContent(activeTab).then(res => {\n      if (selectedCategory.length > 0) {\n        const filteredArticles = res.articles.filter(\n          item => item.meta?.category?.id === selectedCategory[0].id\n        );\n        setArticles(filteredArticles);\n      } else if (!categoryId.value) {\n        setArticles(res.articles);\n      }\n    });\n  }, [selectedCategory, activeTab, categoryId]);\n\n  const filterRegex = useMemo(() => escapeRegExp(filterCategoryValue), [filterCategoryValue]);\n\n  const categoryProps: Articles['category'] = {\n    label: 'Category',\n    placeholder: 'Select categories',\n    onChange: e => {\n      setFilterCategoryValue(e.target.value);\n    },\n    value: filterCategoryValue,\n    mode: 'multi-select',\n    selected: {\n      items: selectedCategory,\n      onRemove: removeCategoryItem\n    },\n    menu: {\n      items: filterCategoryValue\n        ? menuHelpers.flatten(categoryList).filter(({ primary }: MenuItemProps) => {\n            return filterRegex.toLowerCase().includes(primary.toLowerCase());\n          })\n        : categoryListToRender,\n      onItemClick: toggleItem\n    },\n    ref: comboboxRef\n  };\n\n  const sortByProps: Articles['sortBy'] = {\n    label: 'Sort by',\n    placeholder: 'Select sort by',\n    selected: selectedSortByOption\n      ? {\n          items: {\n            id: selectedSortByOption.id,\n            text: selectedSortByOption.primary\n          }\n        }\n      : undefined,\n    menu: {\n      items: sortBy,\n      onItemClick: selectSortByOption\n    }\n  };\n\n  const searchOptions: SearchInputProps = {\n    placeholder: 'Search article',\n    filters: ['Help site 1', 'Help site 2', 'Help site 3'],\n    value: searchVal,\n    onSearchChange: (val: string) => {\n      setSearchVal(val);\n    },\n    onFilterChange: (val: string) => {\n      return val;\n    }\n  };\n\n  const actionOptions = [\n    {\n      id: '1',\n      text: 'Action 1',\n      onClick: (id: string) => action('onClick')(`action ${id}`)\n    },\n    {\n      id: '2',\n      text: 'Action 2',\n      onClick: (id: string) => action('onClick')(`action ${id}`)\n    },\n    {\n      id: '3',\n      text: 'Action 3',\n      onClick: (id: string) => action('onClick')(`action ${id}`)\n    }\n  ];\n\n  const suggestNewArticleAction: Action = {\n    id: 'Suggest action',\n    text: 'Suggest action',\n    onClick: (id: string) => action('onClick')(id),\n    icon: 'plus'\n  };\n\n  let actions;\n  if (args.showAction) {\n    if (args.isSuggestArticleAction) {\n      actions = [suggestNewArticleAction];\n    } else {\n      actions = actionOptions;\n    }\n  }\n\n  const handleClearClick = () => {\n    setQuickFilters([]);\n    setSearchVal('');\n    setCategoryList(curr => {\n      return curr?.map(categoryListItem => {\n        return {\n          ...categoryListItem,\n          selected: false\n        };\n      });\n    });\n    setSortBy(curr => {\n      return curr?.map(sortByListItem => {\n        return {\n          ...sortByListItem,\n          selected: false\n        };\n      });\n    });\n  };\n\n  let timeoutId: ReturnType<typeof setTimeout>;\n  const stopTimeout = () => {\n    clearTimeout(timeoutId);\n  };\n  const onLoadMore = useCallback(() => {\n    if (!loading && !loadingMore && activeTab) {\n      isSetLoadMore(true);\n      setLoading(false);\n      timeoutId = setTimeout(() => {\n        isSetLoadMore(false);\n        setLoading(false);\n        setHasMore(true);\n        setArticles(prevArticles => [\n          ...prevArticles,\n          {\n            articleId: createUID(),\n            title: 'Last article alert!!!',\n            href: 'design.pega.com',\n            abstract:\n              'Last article alert. This is the last article , hence the last index to be noted. This will be appended at the end of the list',\n            meta: {\n              category: {\n                id: 'Category-1',\n                name: 'Retail',\n                onClick: handleCategoryClick\n              },\n              publishedDate: '2023-04-06'\n            },\n            feedback: {\n              articleId: createUID(),\n              likes: 20,\n              dislikes: 80,\n              liked: true,\n              disliked: false,\n              onReaction: () => {}\n            },\n            isFollowed: false,\n            isLiked: true,\n            quickFilters: [\n              { id: '1', name: 'insurance' },\n              { id: '2', name: 'policy' }\n            ]\n          }\n        ]);\n      }, 3000);\n    }\n  }, [loading, loadingMore, activeTab]);\n\n  useEffect(() => {\n    return () => stopTimeout();\n  }, []);\n  return (\n    <div\n      style={{\n        width: '25rem',\n        height: '80vh'\n      }}\n    >\n      <ArticleList\n        header={\n          args.showHeader\n            ? {\n                title: 'Knowledge articles',\n                icon: args.showHeaderIcon ? 'book-open' : '',\n                actions\n              }\n            : undefined\n        }\n        activeTab={activeTab}\n        onTabClick={handleTabChange}\n        skeletonize={false}\n        suggested={{\n          count: args.showCount ? suggestedMock.count : undefined,\n          articles: articles.map(article => {\n            if (\n              !article.feedback ||\n              article.feedback.likes === undefined ||\n              article.feedback.dislikes === undefined\n            ) {\n              return article;\n            }\n\n            const likesValue =\n              (article.feedback?.likes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            const disLikeValue =\n              (article.feedback.dislikes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            return {\n              ...article,\n              feedback: {\n                ...article.feedback,\n                likes: likesValue,\n\n                dislikes: disLikeValue\n              }\n            };\n          })\n        }}\n        followed={{\n          count: args.showCount ? followedMock.count : undefined,\n          articles: articles.map(article => {\n            if (\n              !article.feedback ||\n              article.feedback.likes === undefined ||\n              article.feedback.dislikes === undefined\n            ) {\n              return article;\n            }\n\n            const likesValue =\n              (article.feedback?.likes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            const disLikeValue =\n              (article.feedback.dislikes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            return {\n              ...article,\n              feedback: {\n                ...article.feedback,\n                likes: likesValue,\n\n                dislikes: disLikeValue\n              }\n            };\n          }),\n          searchInput: searchOptions,\n          category: categoryProps,\n          sortBy: sortByProps,\n          onClearClick: handleClearClick,\n          showResults: args.showResults\n        }}\n        search={{\n          count: args.showCount ? searchMock.count : undefined,\n          articles: articles.map(article => {\n            if (\n              !article.feedback ||\n              article.feedback.likes === undefined ||\n              article.feedback.dislikes === undefined\n            ) {\n              return article;\n            }\n\n            const likesValue =\n              (article.feedback?.likes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            const disLikeValue =\n              (article.feedback.dislikes ?? 0 * 100) / article.feedback.likes +\n              article.feedback.dislikes;\n            return {\n              ...article,\n              feedback: {\n                ...article.feedback,\n                likes: likesValue,\n\n                dislikes: disLikeValue\n              }\n            };\n          }),\n          searchInput: searchOptions,\n          category: categoryProps,\n          sortBy: sortByProps,\n          onClearClick: handleClearClick,\n          quickFilters,\n          handleQuickFilterRemove: (id: string) => {\n            setQuickFilters(quickFilters.filter(item => item.id !== id));\n          },\n          showResults: args.showResults\n        }}\n        onQuickFilterClick={(quickFilterParam: QuickFilter) => {\n          handleTabChange('Search');\n          setQuickFilters([...quickFilters, quickFilterParam]);\n        }}\n        loading={loading}\n        loadingMore={loadingMore}\n        onLoadMore={args.showLoadMore && hasMore ? onLoadMore : undefined}\n      />\n    </div>\n  );\n};\n\nArticleListDemo.args = {\n  isSuggestArticleAction: true,\n  showAction: true,\n  showHeader: true,\n  showHeaderIcon: true,\n  showQuickFilters: true,\n  showCount: true,\n  showResults: true,\n  showLoadMore: false\n};\n\nArticleListDemo.argTypes = {\n  isSuggestArticleAction: { control: { type: 'boolean' } },\n  showAction: { control: { type: 'boolean' } },\n  showHeader: { control: { type: 'boolean' } },\n  showHeaderIcon: { control: { type: 'boolean' } },\n  showQuickFilters: { control: { type: 'boolean' } },\n  showCount: { control: { type: 'boolean' } },\n  showResults: { control: { type: 'boolean' } },\n  showLoadMore: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/work/Assignments/Assignments.stories.d.ts

@@ -0,0 +1,11 @@
+import type { StoryFn } from '@storybook/react';
+import type { AssignmentsProps } from '@pega/cosmos-react-work';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+interface AssignmentsStoryProps {
+    collapsed?: boolean;
+    count?: AssignmentsProps['count'];
+    openableTasks?: boolean;
+}
+export declare const AssignmentsDemo: StoryFn<AssignmentsStoryProps>;
+//# sourceMappingURL=Assignments.stories.d.ts.map

package/jsx/work/Assignments/Assignments.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Assignments.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Assignments/Assignments.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EAAE,gBAAgB,EAAiB,MAAM,yBAAyB,CAAC;;AAK/E,wBAGU;AAEV,UAAU,qBAAqB;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,qBAAqB,CAqE1D,CAAC"}

package/jsx/work/Assignments/Assignments.stories.jsx

@@ -0,0 +1,64 @@
+import { useState } from 'react';
+import { MetaList, Text, Link, DateTimeDisplay, Avatar } from '@pega/cosmos-react-core';
+import { Assignments, tasksHelpers as helpers } from '@pega/cosmos-react-work';
+import { AIButtonFormDemo } from '../../core/AIButton/AIButton.stories';
+import viewGroups from '../Tasks/Tasks.mocks';
+export default {
+    title: 'Work/Assignments',
+    component: Assignments
+};
+export const AssignmentsDemo = (args) => {
+    const [hasOpenTask, setHasOpenTask] = useState(false);
+    const [open, setOpen] = useState(true);
+    const activeView = helpers.getSelectedView(viewGroups);
+    const activeViewTaskCount = args.count ?? activeView?.count ?? 0;
+    const taskArray = Array.from({
+        length: args.count ?? activeViewTaskCount
+    }, (_, i) => {
+        const dueIn = 86400000 * i;
+        return {
+            id: `${i}`,
+            name: `Task ${i + 1}`,
+            processName: i % 2 ? 'Demo process' : undefined,
+            avatar: !hasOpenTask && <Avatar name='James Gregory'/>,
+            meta: !hasOpenTask && (<MetaList items={[
+                    <Text variant='secondary'>
+                Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn}/>
+              </Text>,
+                    <Link href='#demo'>Parent case link</Link>
+                ]}/>),
+            additionalActions: [
+                {
+                    id: '1',
+                    text: 'Action 1'
+                },
+                {
+                    id: '2',
+                    text: 'Action 2'
+                }
+            ],
+            onOpen: args.openableTasks !== false
+                ? () => {
+                    setHasOpenTask(true);
+                }
+                : undefined,
+            content: hasOpenTask ? (<AIButtonFormDemo onCancel={() => setHasOpenTask(false)} onSubmit={() => setHasOpenTask(false)}/>) : null
+        };
+    });
+    return (<Assignments count={activeViewTaskCount} items={taskArray} collapsed={args.collapsed !== false ? open : undefined} onToggleCollapsed={args.collapsed !== false
+            ? () => {
+                setOpen(cur => !cur);
+            }
+            : undefined}/>);
+};
+AssignmentsDemo.args = {
+    openableTasks: true,
+    count: undefined,
+    collapsed: true
+};
+AssignmentsDemo.argTypes = {
+    count: { control: { type: 'number' } },
+    openableTasks: { control: { type: 'boolean' } },
+    collapsed: { control: { type: 'boolean' } }
+};
+//# sourceMappingURL=Assignments.stories.jsx.map

package/jsx/work/Assignments/Assignments.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Assignments.stories.jsx","sourceRoot":"","sources":["../../../src/work/Assignments/Assignments.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { MetaList, Text, Link, DateTimeDisplay, Avatar } from '@pega/cosmos-react-core';\nimport { Assignments, tasksHelpers as helpers } from '@pega/cosmos-react-work';\nimport type { AssignmentsProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nimport { AIButtonFormDemo } from '../../core/AIButton/AIButton.stories';\nimport viewGroups from '../Tasks/Tasks.mocks';\n\nexport default {\n  title: 'Work/Assignments',\n  component: Assignments\n} as Meta;\n\ninterface AssignmentsStoryProps {\n  collapsed?: boolean;\n  count?: AssignmentsProps['count'];\n  openableTasks?: boolean;\n}\n\nexport const AssignmentsDemo: StoryFn<AssignmentsStoryProps> = (args: AssignmentsStoryProps) => {\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n  const [open, setOpen] = useState(true);\n\n  const activeView = helpers.getSelectedView(viewGroups);\n  const activeViewTaskCount = args.count ?? activeView?.count ?? 0;\n\n  const taskArray: TaskItemProps[] = Array.from(\n    {\n      length: args.count ?? activeViewTaskCount\n    },\n    (_, i) => {\n      const dueIn = 86400000 * i;\n\n      return {\n        id: `${i}`,\n        name: `Task ${i + 1}`,\n        processName: i % 2 ? 'Demo process' : undefined,\n        avatar: !hasOpenTask && <Avatar name='James Gregory' />,\n        meta: !hasOpenTask && (\n          <MetaList\n            items={[\n              <Text variant='secondary'>\n                Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n              </Text>,\n              <Link href='#demo'>Parent case link</Link>\n            ]}\n          />\n        ),\n        additionalActions: [\n          {\n            id: '1',\n            text: 'Action 1'\n          },\n          {\n            id: '2',\n            text: 'Action 2'\n          }\n        ],\n        onOpen:\n          args.openableTasks !== false\n            ? () => {\n                setHasOpenTask(true);\n              }\n            : undefined,\n        content: hasOpenTask ? (\n          <AIButtonFormDemo\n            onCancel={() => setHasOpenTask(false)}\n            onSubmit={() => setHasOpenTask(false)}\n          />\n        ) : null\n      };\n    }\n  );\n\n  return (\n    <Assignments\n      count={activeViewTaskCount}\n      items={taskArray}\n      collapsed={args.collapsed !== false ? open : undefined}\n      onToggleCollapsed={\n        args.collapsed !== false\n          ? () => {\n              setOpen(cur => !cur);\n            }\n          : undefined\n      }\n    />\n  );\n};\n\nAssignmentsDemo.args = {\n  openableTasks: true,\n  count: undefined,\n  collapsed: true\n};\n\nAssignmentsDemo.argTypes = {\n  count: { control: { type: 'number' } },\n  openableTasks: { control: { type: 'boolean' } },\n  collapsed: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/work/CaseView/Attachments.mocks.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const AttachmentsMock: () => import("react").JSX.Element;
+//# sourceMappingURL=Attachments.mocks.d.ts.map

package/jsx/work/CaseView/Attachments.mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Attachments.mocks.d.ts","sourceRoot":"","sources":["../../../src/work/CaseView/Attachments.mocks.tsx"],"names":[],"mappings":";AAggBA,eAAO,MAAM,eAAe,mCAkI3B,CAAC"}

package/jsx/work/CaseView/Attachments.mocks.jsx

@@ -0,0 +1,397 @@
+import { useState, useCallback, useContext, useEffect, useRef, useMemo, forwardRef } from 'react';
+import { Button, FileInput, FileVisual, Progress, Modal, Text, SummaryList, ViewAll, getKindFromMimeType, getMimeTypeFromFile, Flex, Input, ComboBox, createUID, useModalManager, useModalContext, useToaster, DateTimeDisplay, MetaList, FormDialog } from '@pega/cosmos-react-core';
+import { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';
+import { FileServiceContext, mockAttachmentListRequest, mockCategories } from './FileService.mock';
+const getSummaryListItemProps = ({ ref, file, editFile, cancelFile, deleteFile }) => {
+    let actions;
+    let visual;
+    if ('progress' in file && typeof file.progress === 'number' && file.progress < 100) {
+        visual = <Progress value={file.progress} placement='inline' variant='ring'/>;
+        actions = [
+            {
+                id: 'Cancel',
+                text: 'Cancel',
+                icon: 'times',
+                onClick: () => {
+                    cancelFile(file.id);
+                }
+            }
+        ];
+    }
+    else {
+        visual = (<FileVisual type={getKindFromMimeType(getMimeTypeFromFile(file.name) ?? '')} thumbnail={file.thumbnail}/>);
+        actions = [
+            {
+                id: 'Edit',
+                text: 'Edit',
+                icon: 'pencil',
+                onClick: () => {
+                    editFile?.(file);
+                }
+            },
+            {
+                id: 'Download',
+                text: 'Download',
+                icon: 'download',
+                onClick: () => { }
+            },
+            {
+                id: 'Delete',
+                text: 'Delete',
+                icon: 'trash',
+                onClick: () => {
+                    deleteFile(file.id);
+                }
+            }
+        ];
+    }
+    return {
+        ref,
+        id: file.id,
+        visual,
+        primary: file.name,
+        contextualLabel: file.name,
+        secondary: (<Text variant='secondary'>
+        {'progress' in file && typeof file.progress === 'number' && file.progress < 100 ? (`Uploading…${Math.floor(file.progress)}%`) : (<MetaList items={[
+                    file.category,
+                    <>
+                Uploaded{' '}
+                <DateTimeDisplay variant='relative' value={file.createDate}/>
+              </>
+                ]}/>)}
+      </Text>),
+        actions
+    };
+};
+const EditDialog = forwardRef(function EditDialog({ file, target, onSubmit, onCancel }, ref) {
+    const [name, setName] = useState(file.name);
+    const [error, setError] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [categories, setCategories] = useState(() => {
+        return [
+            { id: createUID(), primary: 'No category', selected: false },
+            ...mockCategories.map(category => {
+                return {
+                    id: createUID(),
+                    primary: category,
+                    selected: file.category === category
+                };
+            })
+        ];
+    });
+    const selectedCategory = useMemo(() => {
+        const sc = categories.find(c => c.selected);
+        return sc
+            ? {
+                items: {
+                    id: sc.id,
+                    text: sc.primary
+                }
+            }
+            : undefined;
+    }, [categories]);
+    return (<FormDialog ref={ref} heading='Edit attachment' target={target} progress={loading ? 'Updating attachment...' : undefined} placement='bottom-start' onCancel={onCancel} onSubmit={() => {
+            if (error)
+                return;
+            setLoading(true);
+            setTimeout(() => {
+                onSubmit({
+                    name,
+                    category: !selectedCategory || selectedCategory.items.text === 'No category'
+                        ? ''
+                        : selectedCategory.items.text
+                });
+                setLoading(false);
+            }, loadingTimeoutMS);
+        }}>
+      <Flex container={{ direction: 'column', gap: 2 }}>
+        <Input label='Name' placeholder='Enter name…' value={name} info={error} status={error ? 'error' : undefined} autoFocus required onChange={(e) => {
+            setName(e.target.value);
+            if (error && e.target.value) {
+                setError('');
+            }
+        }} onBlur={() => {
+            if (!name) {
+                setError('Name is required.');
+            }
+        }}/>
+        <ComboBox label='Category' placeholder='Choose…' selected={selectedCategory} menu={{
+            mode: 'single-select',
+            items: categories,
+            onItemClick: id => {
+                setCategories(cur => {
+                    return cur.map(category => {
+                        return {
+                            ...category,
+                            selected: category.id === id
+                        };
+                    });
+                });
+            }
+        }}/>
+      </Flex>
+    </FormDialog>);
+});
+const AttachmentsModal = ({ defaultMode }) => {
+    const [mode, setMode] = useState(defaultMode);
+    const { push: pushToaster } = useToaster();
+    const { dismiss } = useModalContext();
+    const { files, setFiles, cancelFile, attachFile, deleteFile } = useContext(FileServiceContext);
+    const [search, setSearch] = useState('');
+    const [viewAllLoading, setViewAllLoading] = useState(true);
+    const [addNewLoading, setAddNewLoading] = useState(false);
+    const [newFiles, setNewFiles] = useState([]);
+    const attachSelected = useCallback(() => {
+        newFiles.forEach(attachFile);
+        dismiss();
+    }, [newFiles, attachFile]);
+    const listItemEls = useRef([]);
+    const [editFileIndex, setEditFileIndex] = useState(-1);
+    const editDialogTargetLi = useMemo(() => {
+        return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;
+    }, [editFileIndex, listItemEls]);
+    const menuButton = useMemo(() => editDialogTargetLi
+        ? editDialogTargetLi.querySelector('button[aria-haspopup="menu"]')
+        : null, [editDialogTargetLi]);
+    const handleDialogClose = useCallback(() => {
+        if (!editDialogTargetLi)
+            return;
+        setEditFileIndex(-1);
+        menuButton?.focus();
+    }, [menuButton, editDialogTargetLi]);
+    const handleKeydown = useCallback((e) => {
+        if (e.key === 'Escape') {
+            setEditFileIndex(-1);
+        }
+    }, []);
+    const editDialogRef = useRef(null);
+    useEffect(() => {
+        if (mode === 'viewAll') {
+            const timeout = setTimeout(() => {
+                setViewAllLoading(false);
+            }, 1000);
+            return () => {
+                clearTimeout(timeout);
+            };
+        }
+    }, [mode]);
+    useEffect(() => {
+        if (!editDialogTargetLi)
+            return;
+        document.addEventListener('keydown', handleKeydown);
+        return () => {
+            document.removeEventListener('keydown', handleKeydown);
+        };
+    }, [editDialogTargetLi]);
+    useEffect(() => {
+        listItemEls.current = [];
+    }, [mode]);
+    const onFilesAdded = useCallback((newlyAddedFiles) => {
+        setNewFiles(current => [
+            ...newlyAddedFiles.map((file, i) => {
+                const id = createUID();
+                return {
+                    id,
+                    name: file.name,
+                    category: '',
+                    File: file,
+                    ref: (el) => {
+                        listItemEls.current[i] = el;
+                    },
+                    onEdit: () => {
+                        setEditFileIndex(i);
+                    },
+                    onCancel: () => {
+                        setNewFiles(c => c.filter(f => f.id !== id));
+                    }
+                };
+            }),
+            ...current
+        ]);
+    }, [files]);
+    const actions = mode === 'addNew' ? (<>
+        <Button onClick={dismiss} disabled={addNewLoading}>
+          Cancel
+        </Button>
+        <Button type='submit' variant='primary' onClick={() => {
+            setAddNewLoading(true);
+            setTimeout(() => {
+                attachSelected();
+                setAddNewLoading(false);
+            }, loadingTimeoutMS);
+        }} disabled={newFiles.length === 0 || addNewLoading}>
+          Upload files
+        </Button>
+      </>) : null;
+    const content = mode === 'addNew' ? (<FileInput multiple label='Select files to upload' onFilesAdded={onFilesAdded} files={newFiles.map(f => ({ ...f, meta: f.category || undefined }))}/>) : (<ViewAll loading={viewAllLoading} items={(search ? files.filter(f => f.name.includes(search)) : files).map((file, i) => {
+            return getSummaryListItemProps({
+                ref: (el) => {
+                    listItemEls.current[i] = el;
+                },
+                file,
+                editFile: () => {
+                    setEditFileIndex(i);
+                },
+                cancelFile: id => {
+                    const canceledFile = files.find(f => f.id === id);
+                    cancelFile(id);
+                    pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });
+                },
+                deleteFile: async (id) => {
+                    const deletedFile = files.find(f => f.id === id);
+                    await deleteFile(id);
+                    pushToaster({ content: `${deletedFile.name} deleted` });
+                }
+            });
+        })} actions={[
+            {
+                id: 'addNewFile',
+                text: 'Add files',
+                onClick: () => {
+                    setMode('addNew');
+                }
+            },
+            {
+                id: 'addNewLink',
+                text: 'Add links',
+                onClick: () => {
+                    setMode('addNew');
+                }
+            }
+        ]} searchInputProps={{ onSearchChange: value => setSearch(value) }}/>);
+    return (<Modal as={mode === 'addNew' ? 'form' : undefined} heading={mode === 'addNew' ? 'Add attachments' : 'Attachments'} actions={actions} progress={addNewLoading ? { message: 'Adding attachments...' } : undefined} onRequestDismiss={() => {
+            return !editDialogTargetLi;
+        }} onSubmit={mode === 'addNew'
+            ? (e) => {
+                e.preventDefault();
+            }
+            : undefined}>
+      <>
+        {content}
+        {editDialogTargetLi && menuButton && (<EditDialog ref={editDialogRef} target={menuButton} file={mode === 'addNew' ? newFiles[editFileIndex] : files[editFileIndex]} onCancel={handleDialogClose} onSubmit={({ name, category }) => {
+                handleDialogClose();
+                if (mode === 'addNew') {
+                    setNewFiles(cur => {
+                        return cur.map((file, i) => {
+                            if (i === editFileIndex) {
+                                return {
+                                    ...file,
+                                    name,
+                                    category
+                                };
+                            }
+                            return file;
+                        });
+                    });
+                }
+                else {
+                    setFiles(cur => cur.map((file, i) => {
+                        if (i === editFileIndex) {
+                            return {
+                                ...file,
+                                name,
+                                category
+                            };
+                        }
+                        return file;
+                    }));
+                }
+            }}/>)}
+      </>
+    </Modal>);
+};
+export const AttachmentsMock = () => {
+    const { push: pushToaster } = useToaster();
+    const { create: createModal } = useModalManager();
+    const [loading, setLoading] = useState(true);
+    const { files, setFiles, cancelFile, deleteFile } = useContext(FileServiceContext);
+    const listItemEls = useRef([]);
+    const [editFileIndex, setEditFileIndex] = useState(-1);
+    const editDialogTargetLi = useMemo(() => {
+        return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;
+    }, [editFileIndex, listItemEls]);
+    const menuButton = useMemo(() => editDialogTargetLi
+        ? editDialogTargetLi.querySelector('button[aria-haspopup="menu"]')
+        : null, [editDialogTargetLi]);
+    const handleDialogClose = useCallback(() => {
+        if (!editDialogTargetLi)
+            return;
+        setEditFileIndex(-1);
+        menuButton?.focus();
+    }, [menuButton, editDialogTargetLi]);
+    const handleKeydown = useCallback((e) => {
+        if (e.key === 'Escape') {
+            setEditFileIndex(-1);
+        }
+    }, []);
+    const editDialogRef = useRef(null);
+    useEffect(() => {
+        let mounted = true;
+        (async () => {
+            const attachments = await mockAttachmentListRequest();
+            if (mounted) {
+                setLoading(false);
+                setFiles(attachments);
+            }
+        })();
+        return () => {
+            mounted = false;
+        };
+    }, []);
+    useEffect(() => {
+        if (!editDialogTargetLi)
+            return;
+        document.addEventListener('keydown', handleKeydown);
+        return () => {
+            document.removeEventListener('keydown', handleKeydown);
+        };
+    }, [editDialogTargetLi]);
+    return (<>
+      <SummaryList icon='paper-clip' name='Attachments' headingTag='h3' loading={loading} count={!loading && Array.isArray(files) ? files.length : undefined} actions={[
+            {
+                text: 'Add',
+                id: 'addNew',
+                icon: 'plus',
+                onClick() {
+                    createModal(AttachmentsModal, { defaultMode: 'addNew' });
+                }
+            }
+        ]} items={files.slice(0, 3).map((file, i) => {
+            return getSummaryListItemProps({
+                ref: (el) => {
+                    listItemEls.current[i] = el;
+                },
+                file,
+                editFile: () => {
+                    setEditFileIndex(i);
+                },
+                cancelFile: id => {
+                    const canceledFile = files.find(f => f.id === id);
+                    cancelFile(id);
+                    pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });
+                },
+                deleteFile: async (id) => {
+                    const deletedFile = files.find(f => f.id === id);
+                    await deleteFile(id);
+                    pushToaster({ content: `${deletedFile.name} deleted` });
+                }
+            });
+        })} onViewAll={() => {
+            createModal(AttachmentsModal, { defaultMode: 'viewAll' });
+        }}/>
+      {editDialogTargetLi && menuButton && (<EditDialog ref={editDialogRef} target={menuButton} file={files[editFileIndex]} onCancel={handleDialogClose} onSubmit={({ name, category }) => {
+                handleDialogClose();
+                setFiles(cur => cur.map((file, i) => {
+                    if (i === editFileIndex) {
+                        return {
+                            ...file,
+                            name,
+                            category
+                        };
+                    }
+                    return file;
+                }));
+            }}/>)}
+    </>);
+};
+//# sourceMappingURL=Attachments.mocks.jsx.map