Skip to content

refactor(web): restore DASDFormatProgress with API v2 event model#3230

Merged
joseivanlopez merged 15 commits intomasterfrom
restore-dasd-format-progress
Mar 3, 2026
Merged

refactor(web): restore DASDFormatProgress with API v2 event model#3230
joseivanlopez merged 15 commits intomasterfrom
restore-dasd-format-progress

Conversation

@dgdavid
Copy link
Copy Markdown
Contributor

@dgdavid dgdavid commented Mar 2, 2026

As a follow up of #3143, restores the DASD format progress by adapting DASDFormatProgress to the new API v2 event model, using DASDFormatChanged websocket events to drive progress state and only rendering when formatting is actually active.

To support injecting the per-device progress details into the existing backdrop overlay, ProgressBackdrop was extended with an extraContent prop, which can be used by pages to inject any extra content of their convenience to the progress overlay.

This PR was also taken as an opportunity to improve the readability of the progress overlay, on hold since #2947, by wrapping its content in a Card layout, which provides a clear visual container, structured spacing, and scrollable content for long step messages.

A waitingLabel prop was added as another minor improvement to let consumers override the default "Refreshing data..." message shown while queries finish refetching.

Note: screenshots below were taking using fake data. Thus, do not pay attention to coherence to rendered texts, but to how they are rendered. Only "Formatting devices progress" is a text to be reviewe, check https://github.com/agama-project/agama/pull/3230/changes#diff-3dbadc1060b5324017efc04eb74b73781eaa8d72e8ff7c3a2d934adee4c315f7R101

localhost_8080_ (12) localhost_8080_ (8)

Related to https://trello.com/c/xdvueNDg/, private link.

dgdavid and others added 8 commits February 27, 2026 15:46
Add an `extraContent` prop so consumers can render additional UI below
the progress information in the backdrop overlay, such as per-device
DASD formatting details driven by websocket events.
Use DASDFormatChanged events to drive progress state and render progress
card only when formatting is active.
Refactors the ProgressBackdrop component to improve readability by
wrapping the progress indicator and extra content in a Card layout. This
provides a clear visual container, structured spacing, and scrollable
content for long messages, making progress steps easier to read and
follow. The overlay still subtly dims the background, ensuring focus
remains on the progress information without obscuring the underlying
page.
Add a `waitingLabel` prop to ProgressBackdrop so consumers can override
the default "Refreshing data..." message shown while queries finish
refetching after an operation completes.
joseivanlopez

This comment was marked as resolved.

@joseivanlopez

This comment was marked as outdated.

Co-authored-by: José Iván López <jlopez@suse.com>
@dgdavid

This comment was marked as outdated.

@dgdavid

This comment was marked as resolved.

dgdavid and others added 6 commits March 3, 2026 09:40
To avoid displaying disabled scrollbars when there is no scroll.
The backend does not guarantee the order of devices in DASDFormatChanged
events, so sort by channel on the client side to prevent progress bars
from dancing on each update.
Copy link
Copy Markdown
Contributor

@joseivanlopez joseivanlopez left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@joseivanlopez joseivanlopez merged commit 9859864 into master Mar 3, 2026
9 of 10 checks passed
@joseivanlopez joseivanlopez deleted the restore-dasd-format-progress branch March 3, 2026 12:08
@imobachgs imobachgs mentioned this pull request Mar 17, 2026
imobachgs added a commit that referenced this pull request Mar 17, 2026
Prepare to release version 19.

* #1829
* #2508
* #2772
* #2818
* #2826
* #2848
* #2860
* #2863
* #2864
* #2866
* #2867
* #2869
* #2870
* #2871
* #2872
* #2873
* #2874
* #2875
* #2876
* #2877
* #2880
* #2881
* #2882
* #2884
* #2885
* #2886
* #2891
* #2892
* #2893
* #2894
* #2895
* #2896
* #2897
* #2898
* #2899
* #2900
* #2901
* #2902
* #2903
* #2904
* #2908
* #2909
* #2910
* #2912
* #2913
* #2914
* #2915
* #2916
* #2917
* #2918
* #2920
* #2921
* #2923
* #2924
* #2926
* #2928
* #2929
* #2930
* #2933
* #2934
* #2935
* #2936
* #2937
* #2938
* #2939
* #2942
* #2943
* #2944
* #2945
* #2946
* #2947
* #2948
* #2949
* #2950
* #2951
* #2952
* #2954
* #2955
* #2956
* #2957
* #2958
* #2959
* #2960
* #2961
* #2963
* #2964
* #2965
* #2967
* #2968
* #2969
* #2970
* #2971
* #2972
* #2974
* #2975
* #2977
* #2978
* #2980
* #2981
* #2982
* #2983
* #2984
* #2988
* #2989
* #2990
* #2991
* #2992
* #2993
* #2994
* #2995
* #2996
* #2997
* #2998
* #2999
* #3000
* #3001
* #3002
* #3004
* #3005
* #3006
* #3007
* #3008
* #3009
* #3011
* #3012
* #3013
* #3014
* #3015
* #3016
* #3018
* #3019
* #3020
* #3021
* #3022
* #3023
* #3024
* #3025
* #3026
* #3027
* #3028
* #3029
* #3030
* #3031
* #3033
* #3034
* #3035
* #3036
* #3037
* #3039
* #3040
* #3041
* #3042
* #3043
* #3044
* #3045
* #3046
* #3047
* #3048
* #3049
* #3050
* #3051
* #3052
* #3053
* #3054
* #3055
* #3056
* #3057
* #3058
* #3060
* #3061
* #3062
* #3063
* #3064
* #3065
* #3066
* #3067
* #3068
* #3069
* #3070
* #3071
* #3072
* #3073
* #3074
* #3075
* #3076
* #3077
* #3078
* #3079
* #3086
* #3087
* #3088
* #3089
* #3090
* #3091
* #3092
* #3093
* #3094
* #3095
* #3096
* #3097
* #3098
* #3099
* #3100
* #3101
* #3102
* #3103
* #3104
* #3105
* #3106
* #3107
* #3108
* #3109
* #3110
* #3112
* #3113
* #3114
* #3115
* #3116
* #3117
* #3118
* #3119
* #3120
* #3122
* #3123
* #3124
* #3127
* #3128
* #3129
* #3130
* #3131
* #3133
* #3134
* #3135
* #3136
* #3137
* #3138
* #3139
* #3140
* #3141
* #3142
* #3143
* #3144
* #3145
* #3146
* #3147
* #3148
* #3149
* #3150
* #3151
* #3152
* #3153
* #3154
* #3155
* #3157
* #3158
* #3159
* #3160
* #3161
* #3162
* #3163
* #3164
* #3165
* #3166
* #3167
* #3168
* #3169
* #3170
* #3174
* #3175
* #3176
* #3177
* #3178
* #3179
* #3181
* #3182
* #3184
* #3185
* #3186
* #3188
* #3189
* #3190
* #3191
* #3192
* #3194
* #3195
* #3196
* #3197
* #3198
* #3199
* #3200
* #3201
* #3202
* #3203
* #3205
* #3206
* #3208
* #3209
* #3210
* #3213
* #3214
* #3215
* #3216
* #3217
* #3218
* #3219
* #3220
* #3222
* #3223
* #3224
* #3225
* #3226
* #3227
* #3228
* #3229
* #3230
* #3231
* #3232
* #3233
* #3234
* #3235
* #3236
* #3237
* #3238
* #3239
* #3240
* #3241
* #3242
* #3243
* #3244
* #3246
* #3247
* #3248
* #3250
* #3251
* #3252
* #3253
* #3254
* #3255
* #3256
* #3257
* #3258
* #3259
* #3260
* #3261
* #3262
* #3263
* #3265
* #3266
* #3267
* #3268
* #3269
* #3270
* #3271
* #3272
* #3273
* #3274
* #3275
* #3276
* #3277
* #3278
* #3279
* #3280
* #3281
* #3282
* #3283
* #3284
* #3285
* #3286
* #3287
* #3288
* #3289
* #3290
* #3291
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants