feat(import): change column format during import

[luka-nextcloud]

• Resolves: #837

[luka-nextcloud]

@max-nextcloud @juliushaertl Regarding the column title issue, currently, we do not restrict the duplicate column title. I think we should not allow to create columns with the same title on same table. What do you think?

[juliusknorr]

@max-nextcloud @juliushaertl Regarding the column title issue, currently, we do not restrict the duplicate column title. I think we should not allow to create columns with the same title on same table. What do you think?

I think that would make sense to restrict, maybe we can when importing just add a number to the titles that have duplicates, e.g. having three columns called "title" will result in "title", "title (2)", "title (3)" like we do it in files

[jancborchardt]

Are there any screenshots or quick videos for easier design review, or is all good on that side? :)

[luka-nextcloud]

Are there any screenshots or quick videos for easier design review, or is all good on that side? :)

@jancborchardt Please check the video.

demo.webm

[juliusknorr]

@nextcloud/designers Could you have a look at this?

[juliusknorr]

🏓 @nextcloud/designers

[nimishavijay]

Sorry for the late review!

Overall it looks good! My first impression is that there is a lot of unused whitespace and that some of the wording is not clear, so we can do some changes to help with that:

• [ ] Move the type next to the column name
  • [ ] Column name remains bold, type is normal font weight
  • [ ] They are separated using a middle dot symbol ·
• [ ] Move the example data into a subline and make it var(--color-text-maxcontrast)
• [ ] Now that the column type is next to the title, the edit button can just be a pencil icon
• [ ] Wording changes
  • [ ] "Import table" and "Preview" --> "Preview imported table"
  • [ ] "New column" --> "Create new column"
  • [ ] "Existing column" --> "Replace existing column" (if I understood the functionality correctly)

What do you think? :)

[luka-nextcloud]

@nimishavijay Thanks for your review. Your review looks good to me.

[luka-nextcloud]

@nimishavijay

• "Existing column" --> "Replace existing column" -> I think it should be "Import to existing column".

• When select "Existing column", users have to select column from select box. It is missing from last video. Please provide suggestion for that function also.

• Another behavior is disabling "Create missing columns" will show "Ignore" option at the preview step.

• Could you also give me suggestions regarding responsiveness?

[nimishavijay]

"Existing column" --> "Replace existing column" -> I think it should be "Import to existing column".

If that's the correct functionality then this sounds good!

When select "Existing column", users have to select column from select box. It is missing from last video. Please provide suggestion for that function also.

I see. Then:

• [x] the "Create column" and "Import to existing column" can be in different rows
• [x] the NcSelect component can appear on the right of the "Import to existing column" element
• [x] The edit button can be on the top right

Another behavior is disabling "Create missing columns" will show "Ignore" option at the preview step.

That's perfect. Then it would just be "Import to existing column" and "Ignore column"

Could you also give me suggestions regarding responsiveness?

If all items are on different rows then it should automatically be responsive. Anyway this is a functionality that is unlikely to be widely used on mobile

• [x] The example data can be ellipsised after one line
• [x] The heading can be ellipsised after 2 lines

[luka-nextcloud]

@nimishavijay Please check the update:

demo.webm

[juliusknorr]

Pushed a quick fix for the stylelint error

[juliusknorr]

I'd say lets get this in and we can address further design feedback or pending points as follow ups. So far this works nicely already.

@luka-nextcloud Could you go over the checkboxes in this issue, check them off if done and file follow up issues for those that need to be done still?