Merge branch 'master' into chore/removeOldTemplateEditing

ParabolInc · Apr 15, 2024 · 92204fe · 92204fe
2 parents 521638b + a21f1d0
commit 92204fe
Show file tree

Hide file tree

Showing 257 changed files with 2,203 additions and 1,667 deletions.
diff --git a/.github/workflows/ironbank.yml b/.github/workflows/ironbank.yml
@@ -50,7 +50,7 @@ jobs:
         run: |
           docker cp temp-container:/home/node/parabol/dist ./dist
           docker cp temp-container:/home/node/parabol/build ./build
-          docker cp temp-container:/home/node/tools/ip-to-server_id ./tools/ip-to-server_id
+          docker cp temp-container:/home/node/tools/ip-to-server_id ./ip-to-server_id
 
       - name: Zip the files
         run: zip -r ${{ github.event.inputs.version_number }}.zip dist build

diff --git a/.release-please-manifest.json b/.release-please-manifest.json
@@ -1,3 +1,3 @@
 {
-  ".": "7.26.0"
+  ".": "7.27.0"
 }
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,30 +1,7 @@
 {
   "git.ignoreLimitWarning": true,
-  "eslint.packageManager": "yarn",
   "typescript.tsdk": "node_modules/typescript/lib",
   "editor.tabSize": 2,
-  "eslint.workingDirectories": [
-    {
-      "directory": "./packages/server",
-      "changeProcessCWD": true
-    },
-    {
-      "directory": "./packages/client",
-      "changeProcessCWD": true
-    }
-  ],
-  "eslint.validate": [
-    "javascript",
-    "javascriptreact",
-    {
-      "language": "typescript",
-      "autoFix": true
-    },
-    {
-      "language": "typescriptreact",
-      "autoFix": true
-    }
-  ],
   "npm.packageManager": "yarn",
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": "explicit"
@@ -53,5 +30,6 @@
     "**/graphql/private/schema.graphql": true,
     "**/graphql/public/schema.graphql": true,
     "**/resolverTypes.ts": true
-  }
+  },
+  "tailwindCSS.experimental.classRegex": [["clsx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]]
 }
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,27 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 
 This CHANGELOG follows conventions [outlined here](http://keepachangelog.com/).
 
+## [7.27.0](https://github.com/ParabolInc/parabol/compare/v7.26.0...v7.27.0) (2024-04-11)
+
+
+### Added
+
+* Make top team templates clickable ([#9630](https://github.com/ParabolInc/parabol/issues/9630)) ([e4f8d49](https://github.com/ParabolInc/parabol/commit/e4f8d49c544be1d37388596b1afa086d9eb30a5c))
+* Release activity library for everyone ([#9617](https://github.com/ParabolInc/parabol/issues/9617)) ([92a1dbd](https://github.com/ParabolInc/parabol/commit/92a1dbd18dc25c0046f573a3e46158f5cecdbf17))
+* release recurring retros ([#9625](https://github.com/ParabolInc/parabol/issues/9625)) ([a4f10d1](https://github.com/ParabolInc/parabol/commit/a4f10d193bb38990d8400183c6d320522d2db71e))
+
+
+### Fixed
+
+* Only list available categories in edit template ([#9628](https://github.com/ParabolInc/parabol/issues/9628)) ([fba3b80](https://github.com/ParabolInc/parabol/commit/fba3b80bfdbdb5ab368117a4f3f6bbe4742d1607))
+* use radix-ui for avatars ([#9633](https://github.com/ParabolInc/parabol/issues/9633)) ([38c8e61](https://github.com/ParabolInc/parabol/commit/38c8e61bcc6a199abf0165f49bb0dd7d693962e3))
+
+
+### Changed
+
+* Add absolute date tooltip in history ([#9629](https://github.com/ParabolInc/parabol/issues/9629)) ([65f3119](https://github.com/ParabolInc/parabol/commit/65f311920432416f547e83831cfcdfef2dc570af))
+* remove old new meeting dialog ([#9621](https://github.com/ParabolInc/parabol/issues/9621)) ([b337d17](https://github.com/ParabolInc/parabol/commit/b337d17ff41c4ab4179073ed2eb59a1244998180))
+
 ## [7.26.0](https://github.com/ParabolInc/parabol/compare/v7.25.4...v7.26.0) (2024-04-10)
 
 

diff --git a/package.json b/package.json
@@ -3,7 +3,7 @@
   "description": "An open-source app for building smarter, more agile teams.",
   "author": "Parabol Inc. <[email protected]> (http://github.com/ParabolInc)",
   "license": "AGPL-3.0",
-  "version": "7.26.0",
+  "version": "7.27.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/ParabolInc/parabol"
@@ -78,7 +78,7 @@
   "devDependencies": {
     "@babel/core": "^7.20.12",
     "@babel/preset-env": "7.18.6",
-    "@datadog/datadog-ci": "^2.22.1",
+    "@datadog/datadog-ci": "^2.33.0",
     "@graphql-codegen/add": "^5.0.0",
     "@graphql-codegen/cli": "^5.0.0",
     "@graphql-codegen/typescript": "^4.0.1",

diff --git a/packages/chronos/package.json b/packages/chronos/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chronos",
-  "version": "7.26.0",
+  "version": "7.27.0",
   "description": "A cron job scheduler",
   "author": "Matt Krick <[email protected]>",
   "homepage": "https://github.com/ParabolInc/parabol/tree/master/packages/chronos#readme",
@@ -25,6 +25,6 @@
   },
   "dependencies": {
     "cron": "^2.3.1",
-    "parabol-server": "7.26.0"
+    "parabol-server": "7.27.0"
   }
 }
diff --git a/packages/client/components/ActionMeetingAgendaItems.tsx b/packages/client/components/ActionMeetingAgendaItems.tsx
@@ -93,7 +93,7 @@ const ActionMeetingAgendaItems = (props: Props) => {
         </MeetingTopBar>
         <PhaseWrapper>
           <AgendaVerbatim>
-            <Avatar picture={picture} size={64} />
+            <Avatar picture={picture} className={'h-16 w-16'} />
             <StyledHeading>{content}</StyledHeading>
           </AgendaVerbatim>
           <StyledCopy>{`${preferredName}, what do you need?`}</StyledCopy>

diff --git a/packages/client/components/ActionMeetingUpdatesPrompt.tsx b/packages/client/components/ActionMeetingUpdatesPrompt.tsx
@@ -4,7 +4,6 @@ import React from 'react'
 import {useFragment} from 'react-relay'
 import {ActionMeetingUpdatesPrompt_meeting$key} from '../__generated__/ActionMeetingUpdatesPrompt_meeting.graphql'
 import ActionMeetingUpdatesPromptTeamHelpText from '../modules/meeting/components/ActionMeetingUpdatesPromptTeamHelpText'
-import defaultUserAvatar from '../styles/theme/images/avatar-user.svg'
 import Avatar from './Avatar/Avatar'
 import PhaseHeaderDescription from './PhaseHeaderDescription'
 import PhaseHeaderTitle from './PhaseHeaderTitle'
@@ -89,7 +88,7 @@ const ActionMeetingUpdatesPrompt = (props: Props) => {
   const taskCount = tasks.edges.length
   return (
     <StyledPrompt>
-      <Avatar picture={picture || defaultUserAvatar} size={64} />
+      <Avatar picture={picture} className={'h-16 w-16'} />
       <PromptText>
         <StyledHeader className='max-w-full'>
           {prefix}

diff --git a/packages/client/components/ActivityLibrary/ActivityDetails/ActivityDetailsCategoryBadge.tsx b/packages/client/components/ActivityLibrary/ActivityDetails/ActivityDetailsCategoryBadge.tsx
@@ -7,7 +7,7 @@ import {useFragment} from 'react-relay'
 import {ActivityDetailsCategoryBadge_template$key} from '~/__generated__/ActivityDetailsCategoryBadge_template.graphql'
 import useTemplateCategoryMutation from '../../../mutations/UpdateTemplateCategoryMutation'
 import PlainButton from '../../PlainButton/PlainButton'
-import {CATEGORY_ID_TO_NAME, CATEGORY_THEMES, CategoryID} from '../Categories'
+import {CATEGORY_ID_TO_NAME, CATEGORY_THEMES, CategoryID, MAIN_CATEGORIES} from '../Categories'
 import ActivityDetailsBadge from './ActivityDetailsBadge'
 
 interface Props {
@@ -49,7 +49,7 @@ const ActivityDetailsCategoryBadge = (props: Props) => {
       <DropdownMenu.Portal>
         <DropdownMenu.Content className='border-rad rounded bg-white shadow-lg' sideOffset={5}>
           <DropdownMenu.RadioGroup value={category} onValueChange={updateTemplateCategory}>
-            {Object.keys(CATEGORY_THEMES).map((c) => {
+            {MAIN_CATEGORIES.map((c) => {
               const categoryId = c as CategoryID
               return (
                 <DropdownMenu.RadioItem

diff --git a/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx b/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx
@@ -89,9 +89,6 @@ const ActivityDetailsSidebar = (props: Props) => {
         orgId
         organization {
           name
-          featureFlags {
-            recurringRetros
-          }
         }
         retroSettings: meetingSettings(meetingType: retrospective) {
           ...NewMeetingSettingsToggleCheckIn_settings
@@ -252,9 +249,7 @@ const ActivityDetailsSidebar = (props: Props) => {
           : type === 'action'
             ? 'Check-in'
             : 'Meeting'
-  const withRecurrence =
-    type === 'teamPrompt' ||
-    (selectedTeam.organization.featureFlags.recurringRetros && type === 'retrospective')
+  const withRecurrence = type === 'teamPrompt' || type === 'retrospective'
 
   return (
     <>

diff --git a/packages/client/components/Avatar/Avatar.tsx b/packages/client/components/Avatar/Avatar.tsx
@@ -1,92 +1,34 @@
-import styled from '@emotion/styled'
-import React, {forwardRef, useState} from 'react'
+import clsx from 'clsx'
+import React, {forwardRef} from 'react'
 import defaultUserAvatar from '../../styles/theme/images/avatar-user.svg'
-import AvatarBadge from '../AvatarBadge/AvatarBadge'
-
-type ImageBlockProps = Pick<Props, 'sansRadius' | 'sansShadow' | 'picture' | 'size' | 'onClick'>
-
-const ImageBlock = styled('div')<ImageBlockProps>(
-  ({sansRadius, sansShadow, picture, size, onClick}) => ({
-    backgroundImage: `url(${picture})`,
-    backgroundPosition: 'center center',
-    backgroundRepeat: 'no-repeat',
-    backgroundSize: 'cover',
-    borderRadius: sansRadius ? 0 : '100%',
-    boxShadow: sansShadow ? 'none' : undefined,
-    cursor: onClick ? 'pointer' : 'default',
-    display: 'block',
-    flexShrink: 0,
-    width: size,
-    height: size
-  })
-)
-
-const BadgeBlock = styled('div')({
-  alignItems: 'center',
-  display: 'flex',
-  height: '25%',
-  justifyContent: 'center',
-  position: 'absolute',
-  right: 0,
-  top: 0,
-  width: '25%'
-})
-
-const BadgeBlockInner = styled('div')({
-  flexShrink: 0
-})
+import {Avatar as AvatarRoot} from '../../ui/Avatar/Avatar'
+import {AvatarFallback} from '../../ui/Avatar/AvatarFallback'
+import {AvatarImage} from '../../ui/Avatar/AvatarImage'
 
 interface Props {
+  alt?: string
   className?: string
-  hasBadge?: boolean
-  isConnected?: boolean
   onClick?: (e?: React.MouseEvent) => void
   onMouseEnter?: () => void
   onTransitionEnd?: () => void
-  picture: string
-  sansRadius?: boolean
-  sansShadow?: boolean
-  size: number
+  picture?: string | null
 }
 
-const Avatar = forwardRef((props: Props, ref: any) => {
-  const {
-    className,
-    hasBadge,
-    isConnected,
-    onClick,
-    onMouseEnter,
-    onTransitionEnd,
-    picture,
-    sansRadius,
-    sansShadow,
-    size
-  } = props
-  const [imageUrl, setImageUrl] = useState(picture || defaultUserAvatar)
-  const onError = () => {
-    setImageUrl(defaultUserAvatar)
-  }
+const Avatar = forwardRef<HTMLDivElement, Props>((props, ref) => {
+  const {alt, className, onClick, onTransitionEnd, onMouseEnter, picture} = props
   return (
-    <ImageBlock
-      onTransitionEnd={onTransitionEnd}
-      className={className}
-      ref={ref}
+    <AvatarRoot
       onClick={onClick}
+      onTransitionEnd={onTransitionEnd}
       onMouseEnter={onMouseEnter}
-      sansRadius={sansRadius}
-      sansShadow={sansShadow}
-      picture={imageUrl}
-      size={size}
+      ref={ref}
+      className={clsx(`${onClick && 'cursor-pointer'}`, className)}
     >
-      <img src={imageUrl} className='hidden' onError={onError} />
-      {hasBadge && (
-        <BadgeBlock>
-          <BadgeBlockInner>
-            <AvatarBadge isConnected={isConnected || false} />
-          </BadgeBlockInner>
-        </BadgeBlock>
-      )}
-    </ImageBlock>
+      <AvatarImage src={picture || defaultUserAvatar} alt={alt || 'Avatar'} />
+      <AvatarFallback>
+        <img src={defaultUserAvatar} alt={alt || 'Avatar not found'} />
+      </AvatarFallback>
+    </AvatarRoot>
   )
 })
 

diff --git a/packages/client/components/AvatarList.tsx b/packages/client/components/AvatarList.tsx
@@ -117,7 +117,7 @@ const AvatarList = (props: Props) => {
             onTransitionEnd={onTransitionEnd}
             status={status}
             offset={offsetSize * displayIdx}
-            width={size}
+            className={`${size === 28 ? 'h-7 w-7' : size === 46 ? 'h-[46px] w-[46px]' : ''}`}
             borderColor={borderColor}
           />
         )

diff --git a/packages/client/components/AvatarListUser.tsx b/packages/client/components/AvatarListUser.tsx
@@ -1,5 +1,6 @@
 import styled from '@emotion/styled'
 import graphql from 'babel-plugin-relay/macro'
+import clsx from 'clsx'
 import React from 'react'
 import {useFragment} from 'react-relay'
 import {TransitionStatus} from '~/hooks/useTransition'
@@ -15,26 +16,6 @@ const Wrapper = styled('div')<{offset: number; isColumn?: boolean}>(({offset, is
   transition: `all 300ms ${BezierCurve.DECELERATE}`
 }))
 
-const StyledAvatar = styled(Avatar)<{
-  status?: TransitionStatus
-  isAnimated: boolean
-  borderColor?: string
-  width: number
-}>(({status, isAnimated, borderColor = '#fff', width}) => ({
-  border: `${width >= 40 ? '3px' : '2px'} solid ${borderColor}`,
-  opacity: !isAnimated
-    ? undefined
-    : status === TransitionStatus.EXITING || status === TransitionStatus.MOUNTED
-      ? 0
-      : 1,
-  transform: !isAnimated
-    ? undefined
-    : status === TransitionStatus.EXITING || status === TransitionStatus.MOUNTED
-      ? 'scale(0)'
-      : 'scale(1)',
-  transition: `all 300ms ${BezierCurve.DECELERATE}`
-}))
-
 interface Props {
   className?: string
   offset: number
@@ -43,7 +24,6 @@ interface Props {
   onTransitionEnd?: () => void
   status?: TransitionStatus
   user: AvatarListUser_user$key
-  width: number
   onClick?: () => void
   borderColor?: string
 }
@@ -57,7 +37,6 @@ const AvatarListUser = (props: Props) => {
     status,
     offset,
     isAnimated,
-    width,
     onClick,
     borderColor
   } = props
@@ -74,6 +53,9 @@ const AvatarListUser = (props: Props) => {
   const {tooltipPortal, openTooltip, closeTooltip, originRef} = useTooltip<HTMLDivElement>(
     MenuPosition.UPPER_CENTER
   )
+  const isAnimating =
+    isAnimated && (status === TransitionStatus.EXITING || status === TransitionStatus.MOUNTED)
+
   return (
     <Wrapper
       ref={originRef}
@@ -83,15 +65,13 @@ const AvatarListUser = (props: Props) => {
       onMouseOver={openTooltip}
       onMouseLeave={closeTooltip}
     >
-      <StyledAvatar
-        className={className}
-        status={status}
+      <Avatar
+        className={clsx(
+          `border-solid border-[${borderColor || '#fff'}] duration-300 ease-out ${isAnimating ? 'scale-0 opacity-0' : 'scale-100 opacity-100'}`,
+          className
+        )}
         onTransitionEnd={onTransitionEnd}
         picture={picture}
-        size={width}
-        isAnimated={isAnimated}
-        borderColor={borderColor}
-        width={width}
       />
       {tooltipPortal(preferredName)}
     </Wrapper>