UI – Calendar events modal follow up #17788

jacobshandling · 2024-03-22T00:40:59Z

Follow-up work to #17717 for #17445

Finalize disabled options and tooltips:

Only update policies and settings when there's a diff:

Reorganize onChange handlers, types

Manual QA for all new/changed functionality

codecov · 2024-03-22T00:43:19Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 65.24%. Comparing base (268dd18) to head (955a098).
Report is 3 commits behind head on 17230-calendar-feature.

Additional details and impacted files

@@                   Coverage Diff                   @@
##           17230-calendar-feature   #17788   +/-   ##
=======================================================
  Coverage                   65.24%   65.24%           
=======================================================
  Files                        1202     1202           
  Lines                      109371   109371           
  Branches                     2587     2587           
=======================================================
  Hits                        71358    71358           
  Misses                      32598    32598           
  Partials                     5415     5415

Flag	Coverage Δ
frontend	`51.53% <ø> (ø)`

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

RachelElysia · 2024-03-22T14:47:37Z

frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx

-        teamPoliciesAPI.update(formPolicy.id, {
-          calendar_events_enabled: formPolicy.isChecked,
+      // update changed policies calendar events enabled
+      const changedPolicies = formData.policies.filter((formPolicy) => {


RachelElysia · 2024-03-22T14:48:28Z

frontend/pages/policies/ManagePoliciesPage/_styles.scss

@@ -23,8 +23,21 @@
      width: 360px;
      .is-disabled * {
        color: $ui-fleet-black-25;
+        .label-text {
+          font-style: normal;
+          // increase height to allow for broader tooltip activation area


RachelElysia · 2024-03-22T14:49:27Z

...end/pages/policies/ManagePoliciesPage/components/CalendarEventsModal/CalendarEventsModal.tsx

@@ -157,7 +150,7 @@ const CalendarEventsModal = ({
                name={name}
                // can't use parseTarget as value needs to be set to !currentValue
                onChange={() => {
-                  onInputChange({ name, value: !isChecked });
+                  onPolicyEnabledChange({ name, value: !isChecked });


RachelElysia

Sweet, looks super clean. Love the tooltip implementation and some of the naming updates!!

Just a few styling nits, mostly color, it should be quick fixes:

Dropdown should be blue

2. Description text of a selectable dropdown option should be grey

3. This tooltip should be a dark blue, not black

4. Need to change padding of the code blocks to be smaller

5. Question for @rachaelshaw : Are we moving away from punctuation in single sentence flash messages? If so, we need to remove the periods from the success and fail flash messages to match Figma.

jacobshandling · 2024-03-22T17:11:17Z

@RachelElysia thanks

regarding 3 – I've seen some strange behavior here. I saw that, then refreshed, and it was gone, and figured it was just a matter of loading new stylesheets. But then saw it again, and refreshed, and it went away again. I'll look into it, but I imagine if you hard refresh it should be the right colors.

Regarding 4., I assumed the Figma was inaccurate here - @rachaelshaw do we want to keep the same padding as for other code blocks like this, or update it with less padding per current Figma?

RachelElysia · 2024-03-22T17:17:03Z

@jacobshandling Ah yeah, regarding 4. I made my padding smaller on my other workflows modal, so definitely want to hear back from @rachaelshaw so we are consistent app-wide.

rachaelshaw · 2024-03-22T18:39:10Z

@RachelElysia @jacobshandling we should keep the padding consistent with other code blocks in the UI instead of having it different for just this page. ~~If you let me know what the typical padding is, I'll update the Figma~~ Just updated the Figma to have existing 24px padding (I started with a code block pasted in from an older file, so didn't actually double-check the UI for that one).

jacobshandling · 2024-03-22T18:52:56Z

Thanks @rachaelshaw, that just leaves the flash message copy decisions. Currently in this PR, the messages match those of the "Other workflows" modal, the other dropdown option. If you'd like us to update those msssages (should probably be for both of these modals) to those in the Figma, we can do that too.

rachaelshaw · 2024-03-22T19:55:54Z

that just leaves the flash message copy decisions

Should have a period to be consistent; updated Figma.

## Follow-up work to #17717 **Finalize disabled options and tooltips:** <img width="697" alt="Screenshot 2024-03-21 at 5 14 40 PM" src="https://github.com/fleetdm/fleet/assets/61553566/ea5d880f-75f6-48ef-85cc-b807812c9a50"> <img width="697" alt="Screenshot 2024-03-21 at 5 15 13 PM" src="https://github.com/fleetdm/fleet/assets/61553566/bdd33118-933e-4676-9e1e-680ebcddbc7a"> **Only update policies and settings when there's a diff:** ![1(1)](https://github.com/fleetdm/fleet/assets/61553566/183d1834-3c54-4fef-a208-dfbb0354e507) **Reorganize onChange handlers, types** - [x] Manual QA for all new/changed functionality --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com>

Jacob Shandling added 5 commits March 21, 2024 13:56

finalize disabled dropdown option styles

df7b515

only update changed policies

7133d79

update type name, investigate further improvements

2870384

refactor onInputChange into 2 functions

913ee81

only update config if changed

c59e7c7

jacobshandling requested a review from a team as a code owner March 22, 2024 00:40

jacobshandling temporarily deployed to Docker Hub March 22, 2024 00:41 — with GitHub Actions Inactive

RachelElysia reviewed Mar 22, 2024

View reviewed changes

RachelElysia requested changes Mar 22, 2024

View reviewed changes

Jacob Shandling added 3 commits March 22, 2024 11:00

make automations button always blue

8f8030d

grey help text for valid dropdown options

9aa3c15

restore on tooltips to prevent chaos

955a098

jacobshandling temporarily deployed to Docker Hub March 22, 2024 18:35 — with GitHub Actions Inactive

jacobshandling requested a review from RachelElysia March 22, 2024 18:45

RachelElysia approved these changes Mar 22, 2024

View reviewed changes

jacobshandling merged commit fbf836a into 17230-calendar-feature Mar 22, 2024
10 checks passed

jacobshandling deleted the cal-events-modal-follow-up branch March 22, 2024 18:54

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

UI – Calendar events modal follow up #17788

UI – Calendar events modal follow up #17788

jacobshandling commented Mar 22, 2024 •

edited

Loading

codecov bot commented Mar 22, 2024 •

edited

Loading

RachelElysia Mar 22, 2024

lukeheath Mar 22, 2024

RachelElysia Mar 22, 2024

RachelElysia Mar 22, 2024

RachelElysia left a comment

jacobshandling commented Mar 22, 2024 •

edited

Loading

RachelElysia commented Mar 22, 2024

rachaelshaw commented Mar 22, 2024 •

edited

Loading

jacobshandling commented Mar 22, 2024

rachaelshaw commented Mar 22, 2024

UI – Calendar events modal follow up #17788

UI – Calendar events modal follow up #17788

Conversation

jacobshandling commented Mar 22, 2024 • edited Loading

Follow-up work to #17717 for #17445

codecov bot commented Mar 22, 2024 • edited Loading

Codecov Report

RachelElysia Mar 22, 2024

Choose a reason for hiding this comment

lukeheath Mar 22, 2024

Choose a reason for hiding this comment

RachelElysia Mar 22, 2024

Choose a reason for hiding this comment

RachelElysia Mar 22, 2024

Choose a reason for hiding this comment

RachelElysia left a comment

Choose a reason for hiding this comment

jacobshandling commented Mar 22, 2024 • edited Loading

RachelElysia commented Mar 22, 2024

rachaelshaw commented Mar 22, 2024 • edited Loading

jacobshandling commented Mar 22, 2024

rachaelshaw commented Mar 22, 2024

jacobshandling commented Mar 22, 2024 •

edited

Loading

codecov bot commented Mar 22, 2024 •

edited

Loading

jacobshandling commented Mar 22, 2024 •

edited

Loading

rachaelshaw commented Mar 22, 2024 •

edited

Loading