UI: Add the ability to create LVM Logical Volume from Metalk8s UI #3410

ChengYanJin · 2021-06-02T09:48:41Z

Component: UI

Context: Add the ability to create LVM Logical Volume from the UI

Summary:
For the batch creation, we only implement the most simple case, in which we can only specify the Name between the volumes.

Add interaction test for this kind of volume.

Next step:
We should display a message/notification when the volume is failed to create, for example, the Volume Group doesn't exist.
More generally speaking, we will organise a design workshop with @Cuervino and maybe @JBWatenbergScality @MonPote to decide how to display the message when a failure popup.

Acceptance criteria:

Closes: #3244

JBWatenbergScality · 2021-06-02T15:05:36Z

ui/src/containers/CreateVolume.js

@@ -711,7 +732,7 @@ const CreateVolume = (props) => {
                          />
                        </SizeUnitFieldSelectContainer>
                      </SizeFieldContainer>
-                    ) : (
+                    ) : values.type === RAW_BLOCK_DEVICE ? (


Now that there is more than 2 options I suggest to refactor this to a switch case

JBWatenbergScality · 2021-06-02T15:09:26Z

ui/src/containers/CreateVolume.js

+                      <>
+                        <SizeFieldContainer>
+                          <Input
+                            name="sizeInput"
+                            type="number"
+                            min="1"
+                            value={values.sizeInput}
+                            onChange={handleChange('sizeInput')}
+                            label={`${intl.translate('volume_size')}*`}
+                            error={touched.sizeInput && errors.sizeInput}
+                            onBlur={handleOnBlur}
+                          />
+                          <SizeUnitFieldSelectContainer>
+                            <Input
+                              clearable={false}
+                              type="select"
+                              options={optionsSizeUnits}
+                              noOptionsMessage={() =>
+                                intl.translate('no_results')
+                              }
+                              name="selectedUnit"
+                              onChange={handleSelectChange('selectedUnit')}
+                              value={getSelectedObjectItem(
+                                optionsSizeUnits,
+                                values?.selectedUnit,
+                              )}
+                              error={
+                                touched.selectedUnit && errors.selectedUnit
+                              }
+                              onBlur={handleOnBlur}
+                            />
+                          </SizeUnitFieldSelectContainer>
+                        </SizeFieldContainer>
+                        <Input
+                          name="vgName"
+                          value={values.vgName}
+                          onChange={handleChange('vgName')}
+                          label={`Volume Group Name*`}
+                          error={touched.vgName && errors.vgName}
+                          onBlur={handleOnBlur}
+                        />
+                      </>


Maybe we can extract the fields to a component ? It would then make sense to validate those additional fields in that component and just add an onChange handler prop to that component that just addup the fields value to the submitted object.

Hi @JBWatenbergScality
I am not sure of the benefit to extract these fields. For me, it would add some complexity than keep everything centralized. ( but I am open to discuss).

However, I see a reusable combined field sizeInputCombinedField which is used in both SPARSE_LOOP_DEVICE and LVM_LOGICAL_VOLUME
8cd3fda

bert-e · 2021-06-02T15:57:05Z

Hello chengyanjin,

My role is to assist you with the merge of this
pull request. Please type @bert-e help to get information
on this process, or consult the user documentation.

Status report is not available.

bert-e · 2021-06-02T15:57:08Z

Waiting for approval

The following approvals are needed before I can proceed with the merge:

the author
one peer

Peer approvals must include at least 1 approval from the following list:

bert-e · 2021-06-03T10:59:46Z

Conflict

There is a conflict between your branch improvement/add-lvmvolume-creation-support and the
destination branch development/2.10.

Please resolve the conflict on the feature branch (improvement/add-lvmvolume-creation-support).

 $ git fetch
 $ git checkout origin/improvement/add-lvmvolume-creation-support
 $ git merge origin/development/2.10
 $ # <intense conflict resolution>
 $ git commit
 $ git push origin HEAD:improvement/add-lvmvolume-creation-support

bert-e · 2021-06-03T12:46:59Z

Waiting for approval

The following approvals are needed before I can proceed with the merge:

the author
one peer

Peer approvals must include at least 1 approval from the following list:

Refs: #3244

…aught

Refs: #3244

ChengYanJin · 2021-06-03T16:20:11Z

/approve

bert-e · 2021-06-03T16:20:21Z

In the queue

The changeset has received all authorizations and has been added to the
relevant queue(s). The queue(s) will be merged in the target development
branch(es) as soon as builds have passed.

The changeset will be merged in:

✔️ development/2.10

The following branches will NOT be impacted:

development/2.0
development/2.1
development/2.2
development/2.3
development/2.4
development/2.5
development/2.6
development/2.7
development/2.8
development/2.9

There is no action required on your side. You will be notified here once
the changeset has been merged. In the unlikely event that the changeset
fails permanently on the queue, a member of the admin team will
contact you to help resolve the matter.

IMPORTANT

Please do not attempt to modify this pull request.

Any commit you add on the source branch will trigger a new cycle after the
current queue is merged.
Any commit you add on one of the integration branches will be lost.

If you need this pull request to be removed from the queue, please contact a
member of the admin team now.

The following options are set: approve

bert-e · 2021-06-03T17:30:30Z

I have successfully merged the changeset of this pull request
into targetted development branches:

✔️ development/2.10

The following branches have NOT changed:

development/2.0
development/2.1
development/2.2
development/2.3
development/2.4
development/2.5
development/2.6
development/2.7
development/2.8
development/2.9

Please check the status of the associated issue None.

Goodbye chengyanjin.

ChengYanJin requested a review from a team as a code owner June 2, 2021 09:48

ChengYanJin force-pushed the improvement/add-lvmvolume-creation-support branch from 7fffb91 to 7d77a8a Compare June 2, 2021 09:58

ChengYanJin force-pushed the improvement/add-intergration-test-of-create-volume-error-scenario branch from 341a2f7 to 37c898b Compare June 2, 2021 12:17

ChengYanJin force-pushed the improvement/add-lvmvolume-creation-support branch from 3711237 to 95a7986 Compare June 2, 2021 12:18

JBWatenbergScality reviewed Jun 2, 2021

View reviewed changes

Base automatically changed from improvement/add-intergration-test-of-create-volume-error-scenario to development/2.10 June 2, 2021 15:57

ChengYanJin force-pushed the improvement/add-lvmvolume-creation-support branch 2 times, most recently from 04adea5 to 9e0ba21 Compare June 3, 2021 12:46

ChengYanJin and others added 6 commits June 3, 2021 14:47

ui/volumes: Add LVM volume type in volume creation page

c597471

Refs: #3244

ui/volumes: Add LVM option in volumes duck

33b5c63

ui-tests: Fix test flakiness linked to preload promises failure not c…

e2f2069

…aught

ui/tests: Add interaction test for LVM volume creation

1b88da0

Changelog: Support LVMLogicalVolume volume in the UI

5f65079

ui/volumes: Add switch case for the volume type specific fields

9e0ba21

Refs: #3244

JBWatenbergScality approved these changes Jun 3, 2021

View reviewed changes

bert-e merged commit 320521c into development/2.10 Jun 3, 2021

bert-e deleted the improvement/add-lvmvolume-creation-support branch June 3, 2021 17:30

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

UI: Add the ability to create LVM Logical Volume from Metalk8s UI #3410

UI: Add the ability to create LVM Logical Volume from Metalk8s UI #3410

ChengYanJin commented Jun 2, 2021 •

edited

Loading

JBWatenbergScality Jun 2, 2021

JBWatenbergScality Jun 2, 2021

ChengYanJin Jun 3, 2021

bert-e commented Jun 2, 2021

bert-e commented Jun 2, 2021

bert-e commented Jun 3, 2021

bert-e commented Jun 3, 2021

ChengYanJin commented Jun 3, 2021

bert-e commented Jun 3, 2021

bert-e commented Jun 3, 2021

UI: Add the ability to create LVM Logical Volume from Metalk8s UI #3410

UI: Add the ability to create LVM Logical Volume from Metalk8s UI #3410

Conversation

ChengYanJin commented Jun 2, 2021 • edited Loading

JBWatenbergScality Jun 2, 2021

Choose a reason for hiding this comment

JBWatenbergScality Jun 2, 2021

Choose a reason for hiding this comment

ChengYanJin Jun 3, 2021

Choose a reason for hiding this comment

bert-e commented Jun 2, 2021

Hello chengyanjin,

bert-e commented Jun 2, 2021

Waiting for approval

bert-e commented Jun 3, 2021

Conflict

bert-e commented Jun 3, 2021

Waiting for approval

ChengYanJin commented Jun 3, 2021

bert-e commented Jun 3, 2021

In the queue

bert-e commented Jun 3, 2021

ChengYanJin commented Jun 2, 2021 •

edited

Loading