DESENG-675 Make widget component "reusable" #2579

Baelx · 2024-08-22T00:03:19Z

Issue #: https://citz-gdx.atlassian.net/browse/DESENG-675

Description of changes:

Widget component can now be placed anywhere within an engagement
Update Changelog to include instructions for use

Tips for reviewers

The PR is smaller than it looks, most substantive changes are under met-web/src/components/engagement/admin/create/widgets/* and the rest are just updating dependencies and adding a few props/flags to support the new functionality

User Guide update ticket (if applicable): N/A

NatSquared

Solid work! I have a few minor things I'd like you to revise. but once the test errors are resolved I'd say this is good to go.

NatSquared · 2024-08-22T00:16:13Z

met-api/src/met_api/models/widget.py

@@ -29,6 +29,7 @@ class Widget(BaseModel):  # pylint: disable=too-few-public-methods
    title = db.Column(db.String(100), comment='Custom title for the widget.')
    items = db.relationship('WidgetItem', backref='widget', cascade='all, delete', order_by='WidgetItem.sort_index')
    sort_index = db.Column(db.Integer, nullable=False, default=1)


Does it still make sense to have a sort_index on a widget if its position is determined by its location?

Solid question - I kept it so we could:

use the old widget picker

allow for sorting in the future, which the PO says is a possibility

That said, once we know the fate of the old picker and widgets going forward, a clean-up ticket would be warranted

NatSquared · 2024-08-22T16:49:16Z

met-web/src/components/engagement/form/EngagementWidgets/Documents/CreateFolderForm.tsx

 import { WidgetType } from 'models/widget';
 import { DOCUMENT_TYPE } from 'models/document';
+import { WidgetLocation } from 'models/widget';


Suggested change

import { WidgetType } from 'models/widget';

import { DOCUMENT_TYPE } from 'models/document';

import { WidgetLocation } from 'models/widget';

import { WidgetType, WidgetLocation } from 'models/widget';

import { DOCUMENT_TYPE } from 'models/document';

Thanks for catching this!

NatSquared · 2024-08-22T16:50:01Z

...src/components/engagement/form/EngagementWidgets/WhoIsListening/WhoIsListeningOptionCard.tsx

@@ -12,11 +12,12 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faUserGroupSimple } from '@fortawesome/pro-regular-svg-icons/faUserGroupSimple';
 import { useCreateWidgetMutation } from 'apiManager/apiSlices/widgets';
 import { optionCardStyle } from '../constants';
+import { WidgetLocation } from 'models/widget';


Merge this import with line 9

NatSquared · 2024-08-22T18:02:17Z

met-web/src/components/engagement/admin/create/widgets/WidgetPickerButton.tsx

+        dispatch(
+            openNotificationModal({
+                open: true,
+                data: {


Suggested change

data: {

data: {

style: 'warning',

NatSquared · 2024-08-22T18:06:34Z

met-web/src/components/engagement/admin/view/ConfigSummary.tsx

@@ -178,6 +180,10 @@ export const ConfigSummary = () => {
                        </Grid>
                    </OutlineBox>
                </Grid>
+                <Grid item>
+                    <WidgetPicker location={WidgetLocation.engagementAuthoring} />


I assume in the future these location variables will be based on where the widget will render on the public view, rather than where it's edited on the backend

Whichever makes the most sense to us, the devs. But probably, yes! Whoever starts adding the widget picker to the editor can make the call as to the naming

codecov-commenter · 2024-08-22T18:19:03Z

Codecov Report

Attention: Patch coverage is 73.07692% with 7 lines in your changes missing coverage. Please review.

Project coverage is 76.03%. Comparing base (e2d09dd) to head (0d86c29).

Files	Patch %	Lines
...form/EngagementWidgets/Documents/AddFileDrawer.tsx	50.00%	1 Missing ⚠️
...m/EngagementWidgets/Documents/CreateFolderForm.tsx	50.00%	1 Missing ⚠️
...m/EngagementWidgets/Documents/UploadFileDrawer.tsx	50.00%	1 Missing ⚠️
...gagementWidgets/Events/InPersonEventFormDrawer.tsx	50.00%	1 Missing ⚠️
...agementWidgets/Events/VirtualSessionFormDrawer.tsx	50.00%	1 Missing ⚠️
...nts/engagement/form/EngagementWidgets/Map/Form.tsx	50.00%	1 Missing ⚠️
...ent/form/EngagementWidgets/WidgetDrawerContext.tsx	50.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #2579      +/-   ##
==========================================
- Coverage   76.04%   76.03%   -0.01%     
==========================================
  Files         609      609              
  Lines       22083    22105      +22     
  Branches     1785     1797      +12     
==========================================
+ Hits        16793    16808      +15     
- Misses       5026     5033       +7     
  Partials      264      264

Flag	Coverage Δ
metweb	`65.03% <73.07%> (+<0.01%)`	⬆️

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

Files	Coverage Δ
met-api/src/met_api/models/widget.py	`91.07% <ø> (ø)`
met-api/src/met_api/schemas/widget.py	`100.00% <ø> (ø)`
...ts/engagement/form/EngagementWidgets/Poll/Form.tsx	`81.13% <100.00%> (+0.36%)`	⬆️
...ngagement/form/EngagementWidgets/Timeline/Form.tsx	`70.71% <100.00%> (+0.42%)`	⬆️
...s/engagement/form/EngagementWidgets/Video/Form.tsx	`75.38% <100.00%> (+0.78%)`	⬆️
...ementWidgets/WhoIsListening/WhoIsListeningForm.tsx	`62.50% <ø> (ø)`
...idgets/WhoIsListening/WhoIsListeningOptionCard.tsx	`89.74% <100.00%> (+0.26%)`	⬆️
...gement/form/EngagementWidgets/WidgetCardSwitch.tsx	`18.36% <100.00%> (ø)`
met-web/src/models/widget.tsx	`100.00% <100.00%> (ø)`
...c/services/widgetService/DocumentService/index.tsx	`19.04% <ø> (ø)`
... and 12 more

sonarqubecloud · 2024-08-22T18:46:23Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

Baelx · 2024-08-22T21:03:33Z

API tests have been failing for a while. I created a ticket to look into it: https://citz-gdx.atlassian.net/browse/DESENG-699

Will be going ahead with merging

* DESENG-675 Make widget component "reusable" * DESENG-675 Update changelog, contributing, met-web tests * DESENG-675 Merge import statements, add warning style to widget deletion

DESENG-675 Make widget component "reusable"

143a4cf

NatSquared approved these changes Aug 22, 2024

View reviewed changes

DESENG-675 Update changelog, contributing, met-web tests

c41422b

DESENG-675 Merge import statements, add warning style to widget deletion

0d86c29

Baelx merged commit be4394d into main Aug 22, 2024
14 of 15 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

DESENG-675 Make widget component "reusable" #2579

DESENG-675 Make widget component "reusable" #2579

Baelx commented Aug 22, 2024 •

edited

Loading

NatSquared left a comment

NatSquared Aug 22, 2024

Baelx Aug 22, 2024

NatSquared Aug 22, 2024

Baelx Aug 22, 2024

NatSquared Aug 22, 2024

NatSquared Aug 22, 2024

NatSquared Aug 22, 2024

Baelx Aug 22, 2024 •

edited

Loading

codecov-commenter commented Aug 22, 2024 •

edited

Loading

sonarqubecloud bot commented Aug 22, 2024

Baelx commented Aug 22, 2024

DESENG-675 Make widget component "reusable" #2579

DESENG-675 Make widget component "reusable" #2579

Conversation

Baelx commented Aug 22, 2024 • edited Loading

NatSquared left a comment

Choose a reason for hiding this comment

NatSquared Aug 22, 2024

Choose a reason for hiding this comment

Baelx Aug 22, 2024

Choose a reason for hiding this comment

NatSquared Aug 22, 2024

Choose a reason for hiding this comment

Baelx Aug 22, 2024

Choose a reason for hiding this comment

NatSquared Aug 22, 2024

Choose a reason for hiding this comment

NatSquared Aug 22, 2024

Choose a reason for hiding this comment

NatSquared Aug 22, 2024

Choose a reason for hiding this comment

Baelx Aug 22, 2024 • edited Loading

Choose a reason for hiding this comment

codecov-commenter commented Aug 22, 2024 • edited Loading

Codecov Report

sonarqubecloud bot commented Aug 22, 2024

Quality Gate passed

Baelx commented Aug 22, 2024

Baelx commented Aug 22, 2024 •

edited

Loading

Baelx Aug 22, 2024 •

edited

Loading

codecov-commenter commented Aug 22, 2024 •

edited

Loading