deps(reporter-web-app): Update antd package #6552

mennaElnemr9 · 2023-02-24T14:13:18Z

Update antd package from version 4.16.13 to version 5.2.2.

This update is a backward-incompatible and requires some code fixes.

File antd.css that is imported in App.js and App.css no longer exists in the new version so this import line is removed.

Since version 5.2.2 antd is following CSS-in-JS approach for better support of dynamic themes all CSS files no longer exist.

Except one CSS file which is reset.css for resetting some basic styles.

The file size changes because of the update so the file range in WebAppReporterFunTest.kt is changed to 1830000L..1860000L.

Please ensure that your pull request adheres to our contribution guidelines. Thank you!

mennaElnemr9 · 2023-02-24T14:16:46Z

Update antd package from version 4.16.13 to version 5.2.2.

This update is a backward-incompatible and requires some code fixes.

File antd.css that is imported in App.js and App.css no longer exists in the new version so this import line is removed.

Since version 5.2.2 antd is following CSS-in-JS approach for better support of dynamic themes all CSS files no longer exist.

Except one CSS file which is reset.css for resetting some basic styles.

The file size changes because of the update so the file range in WebAppReporterFunTest.kt is changed to 1830000L..1860000L.

Please ensure that your pull request adheres to our contribution guidelines. Thank you!

The font of the web-app-reporter has some changes because of the antd updates, that's because antd package remove antd.css that had some styles that can be overridden by App.css but with the new update the styles cannot be overridden anymore unless we add the CSS keyword !important besides the styles in App.css that needed to have the highest priority and to override antd styles.

sschuberth · 2023-02-24T14:52:51Z

Thanks a lot @mennaElnemr9 for your work in this area! With all the updates, do you also manually ensure that the web-app report still works and looks as expected?

jens-erdmann · 2023-02-24T15:04:49Z

Thanks a lot @mennaElnemr9 for your work in this area! With all the updates, do you also manually ensure that the web-app report still works and looks as expected?

That is what the previous comment is about. There is a visual difference due to the fact that certain styles are no longer defined by antd. This is something for the project to discuss IMHO.
Are these styles essential or not.

mennaElnemr9 · 2023-02-24T15:39:52Z

Thanks a lot @mennaElnemr9 for your work in this area! With all the updates, do you also manually ensure that the web-app report still works and looks as expected?

After every update I run the project manually to see the effects of every update .
there is also another change besides the one I already mentioned
before updating antd:

After updating antd:

You can see that "clear filters" tab is moved to the left instead of being on the right.

sschuberth · 2023-02-24T17:34:37Z

You can see that "clear filters" tab is moved to the left instead of being on the right.

I'm not sure whether this is acceptable. What do @oss-review-toolkit/core-devs think? And the font in the table is now grayed out it seems!?

mennaElnemr9 · 2023-03-01T09:53:20Z

You can see that "clear filters" tab is moved to the left instead of being on the right.

I'm not sure whether this is acceptable. What do @oss-review-toolkit/core-devs think? And the font in the table is now grayed out it seems!?

Yes right, as I said in my comments earlier there are some changes happened after updating antd package that is responsible for some UI design in the app, font is one of these changes.
there is also a slight change of the colors.

mennaElnemr9 · 2023-03-01T10:16:04Z

So one of the solutions to this problem is using !important which is a CSS keyword to override the antd styles with the app styles like here

in the App.css there are some antd components with some additive features so the app looks how it should look , after the antd update the styles of the antd components styles cannot be overridden by just mentioning them in the CSS file and add the properties that we want to change as the antd styles has the priority , So when using the !important it gives the priority to the App.css styles
we have to use it with all the styles that are needed to be applied over antd components.

mnonnenmacher · 2023-03-02T17:09:01Z

@tsteenbe It would be good to get your feedback here, especially on the CSS changes.

So one of the solutions to this problem is using !important which is a CSS keyword to override the antd styles with the app styles like here

in the App.css there are some antd components with some additive features so the app looks how it should look , after the antd update the styles of the antd components styles cannot be overridden by just mentioning them in the CSS file and add the properties that we want to change as the antd styles has the priority , So when using the !important it gives the priority to the App.css styles we have to use it with all the styles that are needed to be applied over antd components.

@mennaElnemr9 Based on the code comment below it seems we are not using the "official" way to customize the Ant look anyway, so I think any quick fix is ok as the ultimate goal should be to switch to the correct way of theme customization anyway.

ort/reporter-web-app/src/App.css

Lines 20 to 23 in be4bb69

    
           /* 
        
           TODO Switch to use Ant Design customization 
        
           https://ant.design/docs/react/customize-theme 
        
           */

mennaElnemr9 · 2023-03-03T11:06:40Z

@tsteenbe It would be good to get your feedback here, especially on the CSS changes.

So one of the solutions to this problem is using !important which is a CSS keyword to override the antd styles with the app styles like here
in the App.css there are some antd components with some additive features so the app looks how it should look , after the antd update the styles of the antd components styles cannot be overridden by just mentioning them in the CSS file and add the properties that we want to change as the antd styles has the priority , So when using the !important it gives the priority to the App.css styles we have to use it with all the styles that are needed to be applied over antd components.

@mennaElnemr9 Based on the code comment below it seems we are not using the "official" way to customize the Ant look anyway, so I think any quick fix is ok as the ultimate goal should be to switch to the correct way of theme customization anyway.

ort/reporter-web-app/src/App.css

Lines 20 to 23 in be4bb69

/*

TODO Switch to use Ant Design customization

https://ant.design/docs/react/customize-theme

*/

So shall I go with !important solution and adjust the code?

mnonnenmacher · 2023-03-03T12:09:31Z

So shall I go with !important solution and adjust the code?

I would be ok with that.

tsteenbe

Don't merge this PR. Upgrade Ant Design results in multiple deprecation warning/errors.

@mennaElnemr9 I will merge your commit into a large upcoming WebApp PR that I have been working on in which I already rewrote the WebApp code to use Ant Design 5 components API.

jens-erdmann · 2023-04-11T08:28:51Z

Don't merge this PR. Upgrade Ant Design results in multiple deprecation warning/errors.

@mennaElnemr9 I will merge your commit into a large upcoming WebApp PR that I have been working on in which I already rewrote the WebApp code to use Ant Design 5 components API.

Hi @tsteenbe, can you elaborate on these errors? Don't take this personal but I rather have them fixed and this PR finalized than waiting for your PR to emerge at some point in time.

mennaElnemr9 · 2023-04-26T14:45:27Z

I just added some lines to App.css ,

So the final result looks like before updating the antd package

sschuberth · 2023-04-26T14:49:55Z

So the final result looks like before updating the antd package

Sounds great! Could you please rebase your PR onto latest main? The reporter files have moved, but a locally running git should be able to figure it out automatically without running into any conflicts.

sonatype-lift · 2023-04-26T15:09:00Z

reporter-web-app/package.json

@@ -21,7 +21,7 @@
    },
    "dependencies": {
        "@ant-design/icons": "^5.0.1",
-        "antd": "^4.16.13",
+        "antd": "^5.2.2",
        "markdown-to-jsx": "^7.1.9",


Medium Vulnerability:

npm : -/markdown-to-jsx : 7.1.9

0 Critical, 0 High, 1 Medium, 0 Low vulnerabilities have been found across 1 dependencies.
View the Lift console for details about these vulnerabilities.

ℹ️ Expand to see all @sonatype-lift commands

You can reply with the following commands. For example, reply with @sonatype-lift ignoreall to leave out all findings.

Command Usage

@sonatype-lift ignore Leave out the above finding from this PR

@sonatype-lift ignoreall Leave out all the existing findings from this PR

@sonatype-lift exclude <file|issue|path|tool> Exclude specified file|issue|path|tool from Lift findings by updating your config.toml file

Note: When talking to LiftBot, you need to refresh the page to see its response.
_{Click here to add LiftBot to another repo.}

codecov · 2023-04-27T09:00:22Z

Codecov Report

Patch and project coverage have no change.

Comparison is base (96e347e) 64.42% compared to head (4eb3970) 64.43%.

❗ Current head 4eb3970 differs from pull request most recent head 3439c54. Consider uploading reports for the commit 3439c54 to get more accurate results

Additional details and impacted files

@@            Coverage Diff            @@
##               main    #6552   +/-   ##
=========================================
  Coverage     64.42%   64.43%           
  Complexity     1952     1952           
=========================================
  Files           325      325           
  Lines         16433    16433           
  Branches       2353     2353           
=========================================
+ Hits          10587    10588    +1     
+ Misses         4830     4829    -1     
  Partials       1016     1016

Flag	Coverage Δ
test	`39.46% <ø> (ø)`

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

see 1 file with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.

sschuberth · 2023-04-27T09:20:32Z

Please remove the reporter-web-app/node_modules directory from your commit.

sschuberth · 2023-04-27T12:13:59Z

Please also drop the unrelated changes to the .gitmodules files. In general, please always double-check that https://github.com/oss-review-toolkit/ort/pull/6552/files contains only the expected diff.

sschuberth · 2023-04-27T12:23:03Z

plugins/reporters/web-app-template/src/App.css

@@ -249,4 +264,4 @@ tr.ant-table-expanded-row, tr.ant-table-expanded-row:hover {
 .ort-logo {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' id='ORT' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1162.2 260.8' style='enable-background:new 0 0 1162.2 260.8;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:%23FFFFFF;stroke:%23FFFFFF;stroke-width:0.8;stroke-miterlimit:10;%7d .st1%7bfill:%23FFFFFF;stroke:%23FFFFFF;stroke-width:0.4;stroke-miterlimit:10;%7d .st2%7bfill:%23FFFFFF;stroke:%23FFFFFF;stroke-width:1.5;stroke-miterlimit:10;%7d .st3%7bfilter:url(%23Adobe_OpacityMaskFilter);%7d .st4%7bfill:url(%23SVGID_2_);%7d .st5%7bmask:url(%23SVGID_1_);%7d .st6%7bfill:%23D14E60;%7d .st7%7bfill:%23FFFFFF;%7d .st8%7bfill:%23C41C33;%7d .st9%7bfill:%23D4596A;%7d .st10%7bfill:%23E18D99;%7d .st11%7bfill:%23E3949F;%7d .st12%7bfilter:url(%23Adobe_OpacityMaskFilter_1_);%7d .st13%7bfill:url(%23SVGID_4_);stroke:%23FFFFFF;stroke-width:0.4;stroke-miterlimit:10;%7d .st14%7bmask:url(%23SVGID_3_);%7d .st15%7bfill:%23B6A0CB;%7d .st16%7bfill:%23997BB7;%7d .st17%7bfill:%23B39CC9;%7d .st18%7bfill:%239575B3;%7d .st19%7bfill:%23673A93;%7d .st20%7bfill:%23AE97C6;%7d .st21%7bfilter:url(%23Adobe_OpacityMaskFilter_2_);%7d .st22%7bfill:url(%23SVGID_6_);stroke:%23FFFFFF;stroke-width:0.4;stroke-miterlimit:10;%7d .st23%7bmask:url(%23SVGID_5_);%7d .st24%7bfill:%2366CFCC;%7d .st25%7bfill:%2380D7D4;%7d .st26%7bfill:%231FB9B4;%7d .st27%7bfill:%2399DFDD;%7d .st28%7bfill:%2300AFAA;%7d .st29%7bfill:%23B2E7E5;%7d .st30%7bfill:%2385D9D6;%7d .st31%7bfilter:url(%23Adobe_OpacityMaskFilter_3_);%7d .st32%7bfill:url(%23SVGID_8_);stroke:%23FFFFFF;stroke-width:0.4086;stroke-miterlimit:10;%7d .st33%7bmask:url(%23SVGID_7_);%7d .st34%7bfill:%23ECBED6;%7d .st35%7bfill:%23D878AA;%7d .st36%7bfill:%23C53580;%7d .st37%7bfill:%23D56EA4;%7d .st38%7bfill:%23CB498D;%7d .st39%7bfill:%23DF90B9;%7d .st40%7bfill:%23F0CADE;%7d .st41%7bfilter:url(%23Adobe_OpacityMaskFilter_4_);%7d .st42%7bfill:url(%23SVGID_10_);stroke:%23FFFFFF;stroke-width:0.4;stroke-miterlimit:10;%7d .st43%7bmask:url(%23SVGID_9_);%7d .st44%7bfill:%23F39862;%7d .st45%7bfill:%23F0813E;%7d .st46%7bfill:%23EC610E;%7d .st47%7bfill:%23F7BB97;%7d .st48%7bfill:%23F29056;%7d .st49%7bfill:%23F9CCB2;%7d .st50%7bfilter:url(%23Adobe_OpacityMaskFilter_5_);%7d .st51%7bfill:url(%23SVGID_12_);stroke:%23FFFFFF;stroke-width:0.4081;stroke-miterlimit:10;%7d .st52%7bmask:url(%23SVGID_11_);%7d .st53%7bfill:%23B1D6EF;%7d .st54%7bfill:%238FC3E8;%7d .st55%7bfill:%2386BFE6;%7d .st56%7bfill:%23A8D1ED;%7d .st57%7bfill:%2352A3DB;%7d .st58%7bfill:%237DBAE4;%7d .st59%7bfilter:url(%23Adobe_OpacityMaskFilter_6_);%7d .st60%7bfill:url(%23SVGID_14_);stroke:%23FFFFFF;stroke-width:0.4133;stroke-miterlimit:10;%7d .st61%7bmask:url(%23SVGID_13_);%7d .st62%7bfill:%23FAB800;%7d .st63%7bfill:%23FCD466;%7d .st64%7bfill:%23FBCA40;%7d .st65%7bfill:%23FBC838;%7d .st66%7bfill:%23FCD873;%7d .st67%7bfilter:url(%23Adobe_OpacityMaskFilter_7_);%7d .st68%7bfill:url(%23SVGID_16_);%7d .st69%7bmask:url(%23SVGID_15_);%7d .st70%7bfilter:url(%23Adobe_OpacityMaskFilter_8_);%7d .st71%7bfill:url(%23SVGID_18_);stroke:%23FFFFFF;stroke-width:0.3102;stroke-miterlimit:10;%7d .st72%7bmask:url(%23SVGID_17_);%7d .st73%7bfilter:url(%23Adobe_OpacityMaskFilter_9_);%7d .st74%7bfill:url(%23SVGID_20_);stroke:%23FFFFFF;stroke-width:0.3102;stroke-miterlimit:10;%7d .st75%7bmask:url(%23SVGID_19_);%7d .st76%7bfilter:url(%23Adobe_OpacityMaskFilter_10_);%7d .st77%7bfill:url(%23SVGID_22_);stroke:%23FFFFFF;stroke-width:0.3168;stroke-miterlimit:10;%7d .st78%7bmask:url(%23SVGID_21_);%7d .st79%7bfilter:url(%23Adobe_OpacityMaskFilter_11_);%7d .st80%7bfill:url(%23SVGID_24_);stroke:%23FFFFFF;stroke-width:0.3102;stroke-miterlimit:10;%7d .st81%7bmask:url(%23SVGID_23_);%7d .st82%7bfilter:url(%23Adobe_OpacityMaskFilter_12_);%7d .st83%7bfill:url(%23SVGID_26_);stroke:%23FFFFFF;stroke-width:0.3165;stroke-miterlimit:10;%7d .st84%7bmask:url(%23SVGID_25_);%7d .st85%7bfilter:url(%23Adobe_OpacityMaskFilter_13_);%7d .st86%7bfill:url(%23SVGID_28_);stroke:%23FFFFFF;stroke-width:0.3205;stroke-miterlimit:10;%7d .st87%7bmask:url(%23SVGID_27_);%7d .st88%7bfilter:url(%23Adobe_OpacityMaskFilter_14_);%7d .st89%7bfill:url(%23SVGID_30_);%7d .st90%7bopacity:0.4;fill:url(%23SVGID_31_);%7d .st91%7bopacity:0.9;fill:url(%23SVGID_32_);%7d .st92%7bmask:url(%23SVGID_29_);%7d .st93%7bfill:%2359CBC8;%7d .st94%7bopacity:0.5;%7d .st95%7bfill:%23383C45;%7d %3c/style%3e%3cpolygon class='st2' points='88.7,1.3 2.8,87.2 2.8,173.1 2.8,259 88.7,259 174.6,258.9 260.5,173.1 260.5,1.3 '/%3e%3cg%3e%3cdefs%3e%3cfilter id='Adobe_OpacityMaskFilter' filterUnits='userSpaceOnUse' x='2.8' y='1.3' width='257.7' height='257.7'%3e%3cfeColorMatrix type='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0'/%3e%3c/filter%3e%3c/defs%3e%3cmask maskUnits='userSpaceOnUse' x='2.8' y='1.3' width='257.7' height='257.7' id='SVGID_1_'%3e%3cg class='st3'%3e%3clinearGradient id='SVGID_2_' gradientUnits='userSpaceOnUse' x1='-1103.3953' y1='463.1002' x2='-1314.5052' y2='679.0081' gradientTransform='matrix(1 0 0 1 1333.9701 -435.5308)'%3e%3cstop offset='0' style='stop-color:%23FFFFFF'/%3e%3cstop offset='0.1127' style='stop-color:%23F9F9F9'/%3e%3cstop offset='0.262' style='stop-color:%23E8E8E8'/%3e%3cstop offset='0.4319' style='stop-color:%23CDCDCD'/%3e%3cstop offset='0.6171' style='stop-color:%23A6A6A6'/%3e%3cstop offset='0.8122' style='stop-color:%23767676'/%3e%3cstop offset='1' style='stop-color:%23404040'/%3e%3c/linearGradient%3e%3crect x='1.5' y='-2.9' class='st4' width='259' height='264.7'/%3e%3cradialGradient id='SVGID_3_' cx='-2704.3208' cy='2026.3745' r='80.6778' fx='-2726.7773' fy='2028.3864' gradientTransform='matrix(-2.882 -2.1339 0.6264 -0.8836 -8820.7871 -3807.8374)' gradientUnits='userSpaceOnUse'%3e%3cstop offset='3.205128e-04' style='stop-color:%230D0D0D'/%3e%3cstop offset='0.1455' style='stop-color:%23303030;stop-opacity:0.9564'/%3e%3cstop offset='1' style='stop-color:%23FFFFFF;stop-opacity:0.7'/%3e%3c/radialGradient%3e%3crect x='1.5' y='-2.9' style='opacity:0.4;fill:url(%23SVGID_3_);' width='259' height='264.7'/%3e%3clinearGradient id='SVGID_4_' gradientUnits='userSpaceOnUse' x1='1722.2903' y1='-2853.8572' x2='1468.9684' y2='-2707.6016' gradientTransform='matrix(0 1 -1 0 -2653.8706 -1473.4106)'%3e%3cstop offset='0' style='stop-color:%23FFFFFF;stop-opacity:0'/%3e%3cstop offset='0.1082' style='stop-color:%23F9F9F9;stop-opacity:0.1082'/%3e%3cstop offset='0.2516' style='stop-color:%23E8E8E8;stop-opacity:0.2516'/%3e%3cstop offset='0.4148' style='stop-color:%23CDCDCD;stop-opacity:0.4148'/%3e%3cstop offset='0.5927' style='stop-color:%23A6A6A6;stop-opacity:0.5927'/%3e%3cstop offset='0.7824' style='stop-color:%23757575;stop-opacity:0.7824'/%3e%3cstop offset='0.9792' style='stop-color:%233A3A3A;stop-opacity:0.9792'/%3e%3cstop offset='1' style='stop-color:%23333333'/%3e%3c/linearGradient%3e%3cpolygon style='opacity:0.9;fill:url(%23SVGID_4_);' points='1.5,-2.9 1.5,261.7 260.5,261.7 260.5,-2.9 '/%3e%3c/g%3e%3c/mask%3e%3cg class='st5'%3e%3cg%3e%3cpolygon class='st62' points='3.7,86.8 88.3,2.2 88.3,86.8 '/%3e%3cpath class='st7' d='M88,3.1l0,83.3H4.6L88,3.1 M88.7,1.3L2.8,87.2h85.9L88.7,1.3L88.7,1.3z'/%3e%3c/g%3e%3cg%3e%3cpolygon class='st93' points='89.1,172.7 89.1,2.2 259.6,172.7 '/%3e%3cg%3e%3cpath class='st7' d='M89.5,3.1l169.2,169.2H89.5L89.5,3.1 M88.7,1.3l0,171.8h171.8L88.7,1.3L88.7,1.3z'/%3e%3c/g%3e%3c/g%3e%3cg%3e%3cpolygon class='st28' points='89.6,1.7 260.1,1.7 260.1,172.2 '/%3e%3cpath class='st7' d='M259.7,2l0,169.2L90.5,2H259.7 M260.5,1.3H88.7l171.8,171.8L260.5,1.3L260.5,1.3z'/%3e%3c/g%3e%3cg%3e%3crect x='3.2' y='87.6' class='st46' width='85.1' height='85.1'/%3e%3cpath class='st7' d='M88,87.9l0,84.4H3.6l0-84.4H88 M88.7,87.2H2.8l0,85.9h85.9L88.7,87.2L88.7,87.2z'/%3e%3c/g%3e%3cg%3e%3cpolygon class='st57' points='3.2,258.6 3.2,174 87.8,258.6 '/%3e%3cpath class='st7' d='M3.6,174.9l83.3,83.3H3.6L3.6,174.9 M2.8,173.1l0,85.9h85.9L2.8,173.1L2.8,173.1z'/%3e%3c/g%3e%3cg%3e%3cpolygon class='st19' points='89.6,258.6 174.8,173.4 259.6,173.4 174.4,258.6 '/%3e%3cpath class='st7' d='M258.7,173.8l-84.4,84.4l-83.8,0l84.4-84.4H258.7 M260.5,173.1h-85.9L88.7,259l85.9,0L260.5,173.1 L260.5,173.1z'/%3e%3c/g%3e%3cg%3e%3cpolygon class='st8' points='3.7,173.4 173.7,173.4 88.7,258.4 '/%3e%3cpath class='st7' d='M172.8,173.8l-84.1,84.1L4.6,173.8H172.8 M174.6,173.1H2.8L88.7,259L174.6,173.1L174.6,173.1z'/%3e%3c/g%3e%3c/g%3e%3cg class='st94'%3e%3cpolygon class='st57' points='3.2,258.6 3.2,174 87.8,258.6 '/%3e%3cpath class='st7' d='M3.6,174.9l83.3,83.3H3.6L3.6,174.9 M2.8,173.1l0,85.9h85.9L2.8,173.1L2.8,173.1z'/%3e%3c/g%3e%3c/g%3e%3cg%3e%3cpath class='st95' d='M422.8,72.6c0,27.7-14.2,43.4-35.2,43.4c-20.9,0-35.2-15.1-35.2-43.2c0-27.7,14.4-43.7,35.2-43.7 C408.5,28.9,422.8,44.2,422.8,72.6z M363.6,72.7c0,24.4,9.8,34.4,23.9,34.4c14.7,0,23.9-10,23.9-34.6s-9.2-34.8-23.9-34.8 C373.2,37.7,363.6,48,363.6,72.7z'/%3e%3cpath class='st95' d='M488.2,38.6l-5.7,6.5c-6.4-5.1-12.2-7.3-19.3-7.3c-8.9,0-15.6,4.3-15.6,12.5c0,7.5,3.5,11,18.7,15.6 c13.8,4.2,24.7,9.5,24.7,25.3c0,14.7-11,24.8-29.4,24.8c-12,0-21.3-4-28.2-10.8l5.9-6.6c6.4,5.3,12.9,8.6,22.2,8.6 c10.3,0,18.6-5.3,18.6-15.6c0-8.7-4.2-12.5-18.6-16.9c-16.5-5-24.7-11.2-24.7-24.1c0-12.6,10.8-21.6,26-21.6 C474.2,28.9,481.4,32.4,488.2,38.6z'/%3e%3cpath class='st95' d='M553.2,38.6l-5.7,6.5c-6.4-5.1-12.2-7.3-19.3-7.3c-8.9,0-15.6,4.3-15.6,12.5c0,7.5,3.5,11,18.7,15.6 c13.8,4.2,24.7,9.5,24.7,25.3c0,14.7-11,24.8-29.4,24.8c-12,0-21.3-4-28.2-10.8l5.9-6.6c6.4,5.3,12.9,8.6,22.2,8.6 c10.3,0,18.6-5.3,18.6-15.6c0-8.7-4.2-12.5-18.6-16.9c-16.5-5-24.7-11.2-24.7-24.1c0-12.6,10.8-21.6,26-21.6 C539.2,28.9,546.4,32.4,553.2,38.6z'/%3e%3cpath class='st95' d='M381.1,193.6h-7.8V226h-20v-84.7H381c23,0,34.8,8.2,34.8,25.8c0,11.1-5.3,17.8-16.2,22.8l21.5,36h-22.6 L381.1,193.6z M373.3,179.8h8.4c8.8,0,13.4-3.8,13.4-12.7c0-8.2-4.8-11.7-14.7-11.7h-7.2V179.8z'/%3e%3cpath class='st95' d='M483.1,199.2h-40.2c1.3,11.6,6.8,14.8,14.8,14.8c5.3,0,9.9-1.8,15.5-5.7l7.9,10.8c-6.5,5.1-14.8,9-25.3,9 c-21.6,0-32.6-13.9-32.6-34.2c0-19.4,10.6-34.8,30.3-34.8c18.6,0,29.9,12.2,29.9,33.2C483.5,194.3,483.4,197.3,483.1,199.2z M464.5,186.8c-0.1-8.8-2.8-14.9-10.5-14.9c-6.5,0-10.3,4.2-11.1,15.8h21.6V186.8z'/%3e%3cpath class='st95' d='M529,226h-22.8l-20.9-64.9h21l11.5,50.2l12-50.2h19.7L529,226z'/%3e%3cpath class='st95' d='M577.2,137.9c0,6.2-4.8,11-11.5,11s-11.4-4.8-11.4-11c0-6.2,4.6-11,11.4-11S577.2,131.7,577.2,137.9z M575.5,226h-19.3v-64.9h19.3V226z'/%3e%3cpath class='st95' d='M646.7,199.2h-40.2c1.3,11.6,6.8,14.8,14.8,14.8c5.3,0,9.9-1.8,15.5-5.7l7.9,10.8c-6.5,5.1-14.8,9-25.3,9 c-21.6,0-32.6-13.9-32.6-34.2c0-19.4,10.6-34.8,30.3-34.8c18.6,0,29.9,12.2,29.9,33.2C647,194.3,646.9,197.3,646.7,199.2z M628.1,186.8c-0.1-8.8-2.8-14.9-10.5-14.9c-6.5,0-10.3,4.2-11.1,15.8h21.6V186.8z'/%3e%3cpath class='st95' d='M728,226h-23.1l-8.7-47.6l-8.6,47.6h-22.8l-13.8-64.9h19.5l6.7,50.5l10.1-50.5h18.8l8.9,50.5l7.8-50.5h18.4 L728,226z'/%3e%3cpath class='st95' d='M834.9,156.7H814V226h-20v-69.3h-21.9v-15.4h64.7L834.9,156.7z'/%3e%3cpath class='st95' d='M897.7,193.6c0,20.8-12,34.5-31.8,34.5c-19.7,0-31.8-12.7-31.8-34.6c0-20.8,12-34.4,31.8-34.4 C885.7,159,897.7,171.7,897.7,193.6z M854.2,193.5c0,14.4,3.9,20.4,11.7,20.4s11.7-6.2,11.7-20.3c0-14.4-3.9-20.4-11.7-20.4 S854.2,179.4,854.2,193.5z'/%3e%3cpath class='st95' d='M969.1,193.6c0,20.8-12,34.5-31.8,34.5c-19.7,0-31.8-12.7-31.8-34.6c0-20.8,12-34.4,31.8-34.4 C957.1,159,969.1,171.7,969.1,193.6z M925.6,193.5c0,14.4,3.9,20.4,11.7,20.4s11.7-6.2,11.7-20.3c0-14.4-3.9-20.4-11.7-20.4 S925.6,179.4,925.6,193.5z'/%3e%3cpath class='st95' d='M979.6,209.5v-74.2l19.3-2.1v75.5c0,2.7,1.1,4,3.4,4c1.2,0,2.3-0.2,3.2-0.6l3.7,13.7c-2.8,1.2-7,2.2-11.7,2.2 C986.2,228.1,979.6,221.3,979.6,209.5z'/%3e%3cpath class='st95' d='M1036.4,226h-19.3v-90.6l19.3-2.1V226z M1056.8,189.6L1078,226h-21.7l-19.3-35.4l19.8-29.4h19.7L1056.8,189.6 z'/%3e%3cpath class='st95' d='M1105.4,137.9c0,6.2-4.8,11-11.5,11s-11.4-4.8-11.4-11c0-6.2,4.6-11,11.4-11S1105.4,131.7,1105.4,137.9z M1103.7,226h-19.3v-64.9h19.3V226z'/%3e%3cpath class='st95' d='M1159.4,222.9c-4.9,3.4-11.7,5.1-17.6,5.1c-14.3-0.1-21.3-8.2-21.3-23.5v-30.1h-9.2v-13.4h9.2v-14l19.3-2.2 v16.2h14.9l-2.1,13.4h-12.8v29.8c0,6.2,2.1,8.4,6.1,8.4c2.2,0,4.4-0.6,7-2.1L1159.4,222.9z'/%3e%3c/g%3e%3c/svg%3e ");
    background-repeat: no-repeat;
-}
+}


Please re-introduce this final newline.

what do you mean by "re-introduce" it ?

See the diff:

It was there before, but you've removed it without reason, so you should re-introduce it.

I just added new lines to the file so the final line moved to line 257

Having new lines in the file is fine, that's not what I meant. The problem is this red icon on the right-hand side in the green area of the diff. It indicates that you removed a final newline character from the end of the file. That single character is what you need to restore.

sschuberth · 2023-04-27T12:24:15Z

plugins/reporters/web-app-template/yarn.lock

@@ -1,13300 +0,0 @@
-# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.


Why has this file been deleted? That seem wrong.

sonatype-lift · 2023-04-27T13:14:19Z

plugins/reporters/web-app-template/package.json

@@ -21,7 +21,7 @@
    },
    "dependencies": {
        "@ant-design/icons": "^5.0.1",
-        "antd": "^4.16.13",
+        "antd": "^5.2.2",
        "markdown-to-jsx": "^7.1.9",


Medium Vulnerability:

npm : -/markdown-to-jsx : 7.2.0

0 Critical, 0 High, 1 Medium, 0 Low vulnerabilities have been found across 1 dependencies.
View the Lift console for details about these vulnerabilities.

ℹ️ Expand to see all @sonatype-lift commands

You can reply with the following commands. For example, reply with @sonatype-lift ignoreall to leave out all findings.

Command Usage

@sonatype-lift ignore Leave out the above finding from this PR

@sonatype-lift ignoreall Leave out all the existing findings from this PR

@sonatype-lift exclude <file|issue|path|tool> Exclude specified file|issue|path|tool from Lift findings by updating your config.toml file

Note: When talking to LiftBot, you need to refresh the page to see its response.
_{Click here to add LiftBot to another repo.}

sschuberth · 2023-04-27T13:31:03Z

LGTM now, @tsteenbe please have a look.

jens-erdmann · 2023-04-27T16:20:24Z

plugins/reporters/web-app/src/funTest/kotlin/WebAppReporterFunTest.kt

@@ -36,7 +36,7 @@ class WebAppReporterFunTest : WordSpec({

            val report = WebAppReporter().generateReport(ReporterInput(ortResult), outputDir).single()

-            report.length() should beInRange(2140000L..2160000L)
+            report.length() should beInRange(1830000L..1860000L)


https://github.com/oss-review-toolkit/ort/actions/runs/4820292510/jobs/8584578588?pr=6552

java.lang.AssertionError: 1877740 should be in range 1830000..1860000

This still needs adjustment.

Update antd package from version 4.16.13 to version 5.2.2. This update is a backward-incompatible and requires some code fixes. File antd.css that is imported in App.js and App.css no longer exists in the new version so this import line is removed. Since version 5.2.2 antd is following CSS-in-JS approach for better support of dynamic themes all CSS files no longer exist. Except one CSS file which is reset.css for resetting some basic styles. The file size changes because of the update so the file range in WebAppReporterFunTest.kt is changed to 1830000L..1860000L. Add some lines to App.css file so it can override antd updated package changes and get the same UI the app had before updating antd package. Signed-off-by: Menatalla Elnemr <menatalla.elnemr@hella.com>

sonatype-lift · 2023-05-03T08:38:57Z

plugins/reporters/web-app-template/yarn.lock

@@ -8085,9 +8142,9 @@ map-visit@^1.0.0:
    object-visit "^1.0.0"

 markdown-to-jsx@^7.1.9:


Medium Vulnerability:

npm : -/markdown-to-jsx : 7.2.0

0 Critical, 0 High, 1 Medium, 0 Low vulnerabilities have been found across 1 dependencies.
View the Lift console for details about these vulnerabilities.

ℹ️ Expand to see all @sonatype-lift commands

You can reply with the following commands. For example, reply with @sonatype-lift ignoreall to leave out all findings.

Command Usage

@sonatype-lift ignore Leave out the above finding from this PR

@sonatype-lift ignoreall Leave out all the existing findings from this PR

@sonatype-lift exclude <file|issue|path|tool> Exclude specified file|issue|path|tool from Lift findings by updating your config.toml file

Note: When talking to LiftBot, you need to refresh the page to see its response.
_{Click here to add LiftBot to another repo.}

sschuberth · 2023-05-03T10:16:51Z

plugins/reporters/web-app/src/funTest/kotlin/WebAppReporterFunTest.kt

@@ -36,7 +36,7 @@ class WebAppReporterFunTest : WordSpec({

            val report = WebAppReporter().generateReport(ReporterInput(ortResult), outputDir).single()

-            report.length() should beInRange(2140000L..2160000L)
+            report.length() should beInRange(1870000L..1880000L)


Any idea why the report became so much smaller? This looks a bit suspicious, to be honest.

sschuberth · 2023-05-04T08:12:59Z

So the final result looks like before updating the antd package

As discussed in the ORT Community meeting, @jens-erdmann and @tsteenbe please align and double-check on this.

tsteenbe · 2023-05-04T08:34:40Z

WebApp breaks after Ant Design upgrade to v5 see for hints the developer console which turns red with errors/warnings - have been working a proper upgrade in https://github.com/oss-review-toolkit/ort/tree/webapp-reporter-v0.3/ - have already fixed the UI issues.

mennaElnemr9 · 2023-06-15T09:17:16Z

WebApp breaks after Ant Design upgrade to v5 see for hints the developer console which turns red with errors/warnings - have been working a proper upgrade in https://github.com/oss-review-toolkit/ort/tree/webapp-reporter-v0.3/ - have already fixed the UI issues.

Can you tell me when does it exactly break ?as I tried to test it thoroughly and it works as expected, what functionality exactly that leads the app to break so I can test it
?

sschuberth · 2023-11-08T12:58:10Z

@mennaElnemr9 and @tsteenbe could you try to sync up to move this forward? E.g. by creating a draft PR based on @tsteenbe's https://github.com/oss-review-toolkit/ort/tree/webapp-reporter-v0.3/ branch?

tsteenbe · 2023-11-27T21:16:53Z

Marking this pull request as on-hold as it soon be superseded my code changes on the webapp-reporter-v0.3 branch which contains a larger update of the WebApp reporter

tsteenbe · 2023-11-28T20:37:00Z

@mennaElnemr9 Thank you for your contribution but I am closing your pull request in favor of #7952 which implements same update but includes WebApp code changes to remediate deprecation of various APIs in Ant Design v5.

mennaElnemr9 requested review from tsteenbe and a team as code owners February 24, 2023 14:13

sschuberth mentioned this pull request Mar 2, 2023

deps(reporter-web-app): Update React packages #6598

Closed

tsteenbe requested changes Apr 5, 2023

View reviewed changes

mennaElnemr9 force-pushed the mennas-updates branch from b57250b to 925edb7 Compare April 26, 2023 14:41

mennaElnemr9 force-pushed the mennas-updates branch from 925edb7 to 7fadeed Compare April 26, 2023 14:55

sonatype-lift bot reviewed Apr 26, 2023

View reviewed changes

mennaElnemr9 force-pushed the mennas-updates branch from 7fadeed to 5181976 Compare April 27, 2023 08:46

mennaElnemr9 force-pushed the mennas-updates branch 2 times, most recently from 4eb3970 to 1c65123 Compare April 27, 2023 11:42

mennaElnemr9 force-pushed the mennas-updates branch from 1c65123 to 8a77985 Compare April 27, 2023 12:21

sschuberth reviewed Apr 27, 2023

View reviewed changes

mennaElnemr9 force-pushed the mennas-updates branch from 8a77985 to 539d422 Compare April 27, 2023 12:59

sonatype-lift bot reviewed Apr 27, 2023

View reviewed changes

mennaElnemr9 force-pushed the mennas-updates branch from 539d422 to 1b3e941 Compare April 27, 2023 13:20

jens-erdmann reviewed Apr 27, 2023

View reviewed changes

mennaElnemr9 force-pushed the mennas-updates branch from 1b3e941 to 3439c54 Compare May 3, 2023 08:24

sonatype-lift bot reviewed May 3, 2023

View reviewed changes

sschuberth reviewed May 3, 2023

View reviewed changes

tsteenbe added the on hold Pull requests that cannot currently be merged label Nov 27, 2023

tsteenbe mentioned this pull request Nov 28, 2023

Updating build toolchain and deps of Web App reporter #7952

Merged

tsteenbe closed this Nov 28, 2023

Command	Usage
`@sonatype-lift ignore`	Leave out the above finding from this PR
`@sonatype-lift ignoreall`	Leave out all the existing findings from this PR
`@sonatype-lift exclude <file\|issue\|path\|tool>`	Exclude specified `file\|issue\|path\|tool` from Lift findings by updating your config.toml file

		@@ -1,13300 +0,0 @@
		# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.

		@@ -8085,9 +8142,9 @@ map-visit@^1.0.0:
		object-visit "^1.0.0"

		markdown-to-jsx@^7.1.9:

deps(reporter-web-app): Update antd package #6552

deps(reporter-web-app): Update antd package #6552

Conversation

mennaElnemr9 commented Feb 24, 2023

mennaElnemr9 commented Feb 24, 2023

sschuberth commented Feb 24, 2023

jens-erdmann commented Feb 24, 2023

mennaElnemr9 commented Feb 24, 2023

sschuberth commented Feb 24, 2023 • edited Loading

mennaElnemr9 commented Mar 1, 2023

mennaElnemr9 commented Mar 1, 2023

mnonnenmacher commented Mar 2, 2023

mennaElnemr9 commented Mar 3, 2023

mnonnenmacher commented Mar 3, 2023

tsteenbe left a comment

Choose a reason for hiding this comment

jens-erdmann commented Apr 11, 2023

mennaElnemr9 commented Apr 26, 2023

sschuberth commented Apr 26, 2023

sonatype-lift bot Apr 26, 2023

Choose a reason for hiding this comment

npm : -/markdown-to-jsx : 7.1.9

codecov bot commented Apr 27, 2023 • edited Loading

Codecov Report

sschuberth commented Apr 27, 2023

sschuberth commented Apr 27, 2023

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

sonatype-lift bot Apr 27, 2023

Choose a reason for hiding this comment

npm : -/markdown-to-jsx : 7.2.0

sschuberth commented Apr 27, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sonatype-lift bot May 3, 2023

Choose a reason for hiding this comment

npm : -/markdown-to-jsx : 7.2.0

Choose a reason for hiding this comment

sschuberth commented May 4, 2023

tsteenbe commented May 4, 2023 • edited Loading

mennaElnemr9 commented Jun 15, 2023

sschuberth commented Nov 8, 2023

tsteenbe commented Nov 27, 2023

tsteenbe commented Nov 28, 2023

sschuberth commented Feb 24, 2023 •

edited

Loading

codecov bot commented Apr 27, 2023 •

edited

Loading

tsteenbe commented May 4, 2023 •

edited

Loading