feat(ad-hoc): Add create team dialog #8846

igorlesnenko · 2023-09-19T14:21:01Z

Fixes #8827

Not included:

Email invites expires warning

How to test:

add adHocTeam user-level feature flag
go to any meeting in activity library, open teams dropdown
create a team from teams dropdown by clicking "add team"
see that after creating a team it is automatically selected, invites are sent and you can successfully
test with different set of users and custom emails
See if you selected users from different orgs an org selection dropdown appears showing all potential orgs correctly
See if you entered only custom emails, org selection dropdown appears and you can select any of your org

…meeting-template

…adhoc-mutation

…omatically

…o ooo-org-picker

…ol into adhoc-input

…picker-styles

…o ooo-org-picker

igorlesnenko · 2023-09-26T10:48:33Z

@tghanken can you please advise what events do I need to add here?

nickoferrall

I noticed this little bug while testing: https://www.loom.com/share/90dd014360bc44ce8d28312134d5a808

packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx

igorlesnenko · 2023-09-27T15:06:27Z

@nickoferrall that is interesting bug, I iterate viewerOrganizations to show items in dropdown. I think that for some reason you have 2 orgs with same id returned by

  fragment AddTeamDialog_viewer on User {
    ...AdhocTeamMultiSelect_viewer
    organizations {
      id
      name
    }
  }

Not sure that is expected behaviour of the app. Is it possible that some of the DB data is wrong and you have yourself added to the org twice?

tghanken

We should try to keep the analytics here in line with what we did for 1:1 teams, there are two places that I see to add events in.

packages/client/components/AddTeamDialog.tsx

tghanken

Here's my other comment, I missed hitting add to review the first time 😮‍💨

packages/client/components/NewMeetingTeamPicker.tsx

nickoferrall

Two small changes and then it LGTM!

packages/client/components/AddTeamDialog.tsx

nickoferrall · 2023-09-28T16:06:33Z

packages/client/components/AddTeamDialog.tsx

+          )}
+        </fieldset>
+
+        {showOrgPicker && (


+1 I think the org picker should always be visible so the height of the modal doesn't change when you select an item. It would also be reassuring for me that I've selected the right team from the right org

If org picker will be always visible it will show one single org in most of cases. Would this be ok? Tagging @acressall for this design question

I actually don't mind the small height change. I suspect that a lot of users aren't aware of the concept of orgs, and it could be especially confusing in this context, so I only want to bring it up when we actually need the information

packages/client/ui/Input/Input.tsx

nickoferrall · 2023-09-28T16:23:21Z

packages/client/ui/Input/Input.tsx

+      <input
+        type={type}
+        className={twMerge(
+          'flex h-11 w-full rounded border-2 border-slate-300 bg-transparent px-2 py-1 text-sm font-semibold focus:outline-none focus-visible:border-sky-500 disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-slate-600',


-1 on focus, this new input is blue, but the rest of our inputs go from grey to black. Also, the font is bolder in this input vs others.

I made a new input to be matched with new select and multi select components we introduced previously. Not sure if I need to change it to match our old components, tagging @acressall for this question

The design team has been working add focus states, and they are all sky 500, so this is good!

I think the weight is incorrect though, in the designs the label is semibold, but the placeholder and input are regular

nickoferrall · 2023-09-28T16:26:49Z

packages/client/components/AddTeamDialog.tsx

+          <SecondaryButton onClick={onClose} size='small'>
+            Cancel
+          </SecondaryButton>
+          <PrimaryButton size='small' onClick={handleAddTeam} disabled={submitting || !isValid}>


+1 I'd prefer the buttons to be a bit larger as they feel slightly small to me:

made bigger

nickoferrall · 2023-09-28T16:33:18Z

packages/client/components/AddTeamDialog.tsx

+
+        <fieldset className={fieldsetStyles}>
+          <label className={labelStyles}>Team name</label>
+          <Input


-1 we're enforcing a team name length limit of 50 characters, but not giving users feedback that that will happen. So if I create a team with 55 characters, the last 5 characters get removed without me knowing.

We could add maxLength={MAX_TEAM_NAME_LENGTH} to the input. Or, for the optimal UX, we could give the user some feedback that there's a limit.

I just removed this now, and allow backend to validate this. I think rarely someone would type 50 chars

nickoferrall · 2023-09-28T16:33:41Z

packages/client/components/AddTeamDialog.tsx

+  const [teamName, setTeamName] = useState('')
+  const [teamNameManuallyEdited, setTeamNameManuallyEdited] = useState(false)
+
+  const MAX_TEAM_NAME_LENGTH = 50


+1 it looks like the limit in pg is 100 characters so I was wondering why 50 here?

@nickoferrall we have 50 characters validation set on the backend and when we creating a team from http://localhost:3000/newteam/1. So I kept it as is here too

tghanken

Analytics look good!

packages/client/components/AddTeamDialog.tsx

igorlesnenko · 2023-09-29T08:10:24Z

I noticed this little bug while testing: https://www.loom.com/share/90dd014360bc44ce8d28312134d5a808

Two small changes and then it LGTM!

@nickoferrall so was it some wrong data in the DB?

nickoferrall

@nickoferrall so was it some wrong data in the DB?

Yep, that was it. LGTM!

packages/client/components/AddTeamDialog.tsx

Dschoordsch · 2023-10-05T10:16:57Z

packages/client/components/AddTeamDialogRoot.tsx

+  return (
+    <Suspense fallback={renderLoader()}>
+      {queryRef && (
+        <AddTeamDialog onAddTeam={onAddTeam} isOpen={true} onClose={onClose} queryRef={queryRef} />


+1 normally one would mount the dialog and then only modify isOpen so we can get a transition.

Transition works for me like this. Can you record a video?

I'll merge this PR in the mean time, and will fix it in next PRs if it is an issue

sentry-io · 2023-10-10T07:33:19Z

Suspect Issues

This pull request was deployed and Sentry observed the following issues:

‼️ TypeError: Cannot read properties of undefined (reading 'orgId') defaultOrgId(packages/client/components/Activit... View Issue

_{Did you find this useful? React with a 👍 or 👎}

igorlesnenko added 30 commits July 26, 2023 12:12

chore(one-on-one): add oneOnOne org feature flag

e30c7a6

chore(one-on-one): add one-on-one meeting template

d9686bb

Change color

4e8958d

Merge branch 'master' of github.com:ParabolInc/parabol into oneonone-…

a4c51b1

…meeting-template

Put one on one in standup

a3d5b02

Merge branch 'master' of github.com:ParabolInc/parabol into oneonone-…

5a5bc42

…meeting-template

feat(one-on-one): allow oneOnOne input in startCheckIn mutation

a8bc994

Merge branch 'master' of github.com:ParabolInc/parabol into oneonone-…

ea045d7

…adhoc-mutation

fix checkin

b0aa11f

revert duplicate meeting check

31fe645

Remove userId option

092ab6f

Publish team payload

83f7d02

chore(one-on-one): Add user picker

192056f

Submit mutation

7d99836

remove ui/input

c6feaeb

Code cleanup

3082e9e

chore(one-on-one): add user picker styles

291adf2

args validation

89f16d5

prettier

3d2f558

generateOneOnOneTeamName

53e6a8f

isOneOnOneTeam

f8a2d00

chore(one-on-one): show organiation picker if can't determine org aut…

ac3e7ec

…omatically

Enable multiple false

fb1d7b5

Merge branch 'ooo-picker-styles' of github.com:ParabolInc/parabol int…

69c68b7

…o ooo-org-picker

chore(one-on-one): Add team exists warning

0cee2c3

use isOneOnOne team to find teams

4de5d3d

Merge branch 'oneonone-adhoc-mutation' of github.com:ParabolInc/parab…

39ce1d2

…ol into adhoc-input

Merge branch 'adhoc-input' of github.com:ParabolInc/parabol into ooo-…

fe0770d

…picker-styles

Merge branch 'ooo-picker-styles' of github.com:ParabolInc/parabol int…

8df1d81

…o ooo-org-picker

Add analytics

f45594f

Auto-generate team name

6b7b44c

nickoferrall requested changes Sep 27, 2023

View reviewed changes

packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx Show resolved Hide resolved

igorlesnenko added 4 commits September 27, 2023 16:27

Add email expires warning

1293118

Fix unnecessary spacing

254b623

tweak padding

bc6d823

tweak select height

46525c6

igorlesnenko requested a review from nickoferrall September 28, 2023 08:31

tghanken requested changes Sep 28, 2023

View reviewed changes

packages/client/components/AddTeamDialog.tsx Show resolved Hide resolved

tghanken reviewed Sep 28, 2023

View reviewed changes

packages/client/components/NewMeetingTeamPicker.tsx Show resolved Hide resolved

nickoferrall requested changes Sep 28, 2023

View reviewed changes

Add events

47566e6

igorlesnenko requested a review from tghanken September 28, 2023 17:33

tghanken approved these changes Sep 28, 2023

View reviewed changes

packages/client/components/AddTeamDialog.tsx Outdated Show resolved Hide resolved

igorlesnenko added 5 commits September 29, 2023 10:23

Show name length error from backend

0254bad

Move styles outside

27f506e

Remove React prefix

399f91c

Bigger button

2b804e0

Update styles

6da1745

igorlesnenko requested review from nickoferrall and acressall September 29, 2023 19:09

nickoferrall approved these changes Oct 2, 2023

View reviewed changes

igorlesnenko requested a review from Dschoordsch October 3, 2023 08:08

Dschoordsch approved these changes Oct 5, 2023

View reviewed changes

Don't show org picker if user has a single org

cc91ab8

igorlesnenko merged commit 14a32aa into master Oct 5, 2023

igorlesnenko deleted the ad-hoc-dialog branch October 5, 2023 16:37

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(ad-hoc): Add create team dialog #8846

feat(ad-hoc): Add create team dialog #8846

igorlesnenko commented Sep 19, 2023 •

edited

Loading

igorlesnenko commented Sep 26, 2023

nickoferrall left a comment

igorlesnenko commented Sep 27, 2023

tghanken left a comment

tghanken left a comment

nickoferrall left a comment

nickoferrall Sep 28, 2023

igorlesnenko Sep 29, 2023

acressall Sep 29, 2023

nickoferrall Sep 28, 2023

igorlesnenko Sep 29, 2023

acressall Sep 29, 2023

acressall Sep 29, 2023

igorlesnenko Sep 29, 2023

nickoferrall Sep 28, 2023

igorlesnenko Sep 29, 2023

nickoferrall Sep 28, 2023

igorlesnenko Sep 29, 2023 •

edited

Loading

nickoferrall Sep 28, 2023

igorlesnenko Sep 29, 2023

tghanken left a comment

igorlesnenko commented Sep 29, 2023 •

edited

Loading

nickoferrall left a comment

Dschoordsch Oct 5, 2023

igorlesnenko Oct 5, 2023

sentry-io bot commented Oct 10, 2023

feat(ad-hoc): Add create team dialog #8846

feat(ad-hoc): Add create team dialog #8846

Conversation

igorlesnenko commented Sep 19, 2023 • edited Loading

igorlesnenko commented Sep 26, 2023

nickoferrall left a comment

Choose a reason for hiding this comment

igorlesnenko commented Sep 27, 2023

tghanken left a comment

Choose a reason for hiding this comment

tghanken left a comment

Choose a reason for hiding this comment

nickoferrall left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

igorlesnenko Sep 29, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

tghanken left a comment

Choose a reason for hiding this comment

igorlesnenko commented Sep 29, 2023 • edited Loading

nickoferrall left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sentry-io bot commented Oct 10, 2023

Suspect Issues

igorlesnenko commented Sep 19, 2023 •

edited

Loading

igorlesnenko Sep 29, 2023 •

edited

Loading

igorlesnenko commented Sep 29, 2023 •

edited

Loading