✂️ UX Paper Cuts 17.9 → Import and Integrate

Topics:

  1. Importers - direct transfer and 3rd party importers like GitHub, Bitbucket
  2. Webhooks
  3. Repository import by URL - importing git repos is very common, unfortunately the UX is poor

Reviewers, team members

reviewer / team member area comment
@m_frankiewicz PM
@justin_ho @wortschi @obaiye frontend groupimport and integrate specific changes
Reviewer roulette frontend Any general changes
@.luke backend groupimport and integrate specific changes
Reviewer roulette backend Any general changes
@ashrafkhamis Technical Writing After January 17
#doc Technical Writing Before January 17

Planning

Status legend

Status Emoji
In work
In review 👀
Merged ✅

Work

Product Storybook (Prerequisites)

task issue designer status
GitLab storybook add missing features (!178028 - merged) • Sascha Eggenberger • 17.9 – @seggenberger ✅
Storybook: Fix CSS url() assets (!178070 - merged) • Sascha Eggenberger • 17.9 – @seggenberger ✅
Storybook: Fix broken stories (!178128 - merged) • Sascha Eggenberger • 17.9 – @seggenberger ✅

Multi-step form — BIG, separable

task issue designer status
Form component #512624 (closed) @jmiocene ✅ !177937 (merged)
Creation destination #512625 (closed) @jmiocene
Single/multiple choice component #512626 (closed) @jmiocene ✅ !177861 (merged)
Apply components (multiple MRs) #514700 (closed) @jmiocene !178859 (merged) !179702 (merged) !179711 (merged) !179733 (merged) !180221 (merged)
Make DT option more visible #451514 @jmiocene ✅ !178859 (merged)
Show option availability on a first step #512627 (closed) @jmiocene ✅ !179733 (merged)

3d parties — MEDIUM

task issue designer status
Migrate to a shared header (multiple MRs) @seggenberger
Apply shared table component (multiple MRs)
General clean up (multiple MRs)
GitHub import: improve OAuth flow #433090 (closed)
Import group: Migrate components used (!180376 - merged) • Sascha Eggenberger • 17.9 @seggenberger 👀
Import groups by direct transfer: Cleanup inter... (!180534 - merged) • Sascha Eggenberger • 17.9 @seggenberger 👀
Authenticate with GitHub: Migrate components (!180545 - merged) • Sascha Eggenberger • 17.9 @seggenberger 👀

Import history — BIG, separable

task issue designer status
Add to a navigation bar #431178 @annabeldunstone ✅ !179752 (merged)
Show history to other Group members #441403 (closed)
Create a shared table component #516248 (closed) @clavimoniere !180098 (merged)
Align the parent dropdowns/names #340605 @annabeldunstone
Add table header sorting #299269 (closed), #354678
Apply shared table component (multiple MRs)
Merge all histories into one
Allow users to cancel import #250347 (closed)
Allow users to re-import failed relations (design only) #441413
Exclude "created from template" from history
Merge failures page with history
Add import history Empty State

Import progress — SMALL

task issue designer status
Replace "in progress" page with a history page #391198

Webhooks — MEDIUM

task issue designer status
Clean up, regular UX Paper Cuts work (multiple MRs) #513631 (closed) @clavimoniere

Import from URL — SMALL

task issue designer status
Clean up, regular UX Paper Cuts work (multiple MRs)
"Repository by URL" project import page sends incomplete credentials while typing #461392
Import project from repository by URL - stuck when incorrect URL is inserted #289801 (closed)
Repository import by URL throws "There is not a valid Git repository at this URL" on valid Git URL #366769

Integration

task issue designer status
Integrations: Update heading and crud table bor... (!178133 - merged) • Sascha Eggenberger • 17.9 @seggenberger ✅
Integrations detail page: Migrations and small ... (!178141 - merged) • Sascha Eggenberger • 17.9 @seggenberger ✅
Integration settings: Migrate section to Settin... (!178146 - merged) • Sascha Eggenberger • 17.9 @seggenberger ✅
Integration: Item changes (!178155 - merged) • Sascha Eggenberger • 17.9 @seggenberger ✅

Design tokens

task issue designer status
Integrate findings of design system team &16184 (closed) @seggenberger
Integrations: Update heading and crud table bor... (!178133 - merged) • Sascha Eggenberger • 17.9 &16184 (closed) @seggenberger ✅

Importers related issues, mostly Direct transfer importer (migrations between GL instances)

Within this topic we have a theme of visibility of the importer itself and the import results. I think we should rethink where and and how (structure) the import results are shown, to whom, what information is available in the UI, and what information should be available for download (possibly).

  • Direct transfer should be more visible and easy to find from UI — relates to form concept
  • Improve discoverability of import results. There's a design proposal in this issue for incremental change and a couple of questions possibly leading to larger changes.
  • Provide comprehensive, filterable and searchable report of migration process - this is just a draft of an idea. This would require further research, user validation. If we decided to work on it, I believe it would be a larger piece of work itself.
  • Show import results to more users than only migrating user
  • Showing the progress of the import
  • Support efficient selection of resources to be ... (&9756) • Unassigned
  • Re-import project chosen relation from UI. As the amount of migrated data is usually large, for more than one group and many projects and comprises of different data types (like issues, MRs, comments). - this is not possible yet from the API, currently this capacity is not there at all, but we nevertheless it would help to have a user workflow and design for it. In a way this problem is similar to Support efficient selection of resources to be ... (&9756).
  • Another functionality covered via API and not UI is cancelling migrations
  • There are some other issues if we have a room for something else GitLab Migration - UX improvements (&4613)
  • Further improvements of group imports history API - this could be bigger than a paper cut

GitHub importer:

  • GitHub import: improve OAuth flow design and do... (#433090 - closed)

Design explorations

There are some fresh design explorations — https://gitlab.com/gitlab-com/Product/-/issues/13128#note_1930968510

Videos

  • Introduction and direct transfer: https://drive.google.com/file/d/1kJ3qs8Y6uGlasiR4gLmKvhW0G0QP18ND/view?usp=share_link
  • How import results are shown - older video, but shows how errors are showed, shows also GH importer: https://drive.google.com/file/d/1YPy4dTyW1hHlLmPqCTEYoaghxpXVb0r9/view?usp=share_link
  • GitHub importer as an example of a 3rd party importer: https://drive.google.com/file/d/1NI8mUYVlJvE5PcISk6d9aKfodA_It3j3/view?usp=sharing

Documentation

  • Importers user docs - entry point, on the docs menu you can navigate to each specific importer docs
  • Direct transfer docs: https://docs.gitlab.com/ee/user/group/import/
  • Direct transfer API docs: https://docs.gitlab.com/ee/api/bulk_imports.html
  • Project relation API docs and group relation API docs (used in direct transfer) - perhaps this could be useful to show import progress

Pages group owns with instructions on how to set them up locally: https://docs.google.com/spreadsheets/d/1IAKUKHVcrWx7kANYA_fsRKOMxEMZWsXK1kgf16_4dMo/edit?usp=sharing

URLs for pages

See &16184 (comment 2263805179)

Webhooks

  • UX review and improvement of the webhooks form - described in #499697 (comment 2199627198)
  • UX for Allow more fine grained configuration of webhooks (#17898 - closed) - in relation to above (as triggers are now on the webhook form) and a feature enhancement, that would enable to implement more granular triggers, asked for by large customers, like Add deletion events such as deletion of discuss... (#377475).

Repository import by URL

Importing git repos is very common, unfortunately the UX is poor. We have 25 👍🏻 on this bug: Repository import by URL throws "There is not a... (#366769) and there are related bugs, from which it looks like the form doesn't lead user well nor provide good feedback on mistakes:

  • "Repository by URL" project import page sends i... (#461392)
  • Import project from repository by URL - stuck w... (#289801 - closed)
  • Docs feedback: import-by-url: how to import git... (#330422 - closed)
  • Import project by URL where source repository ... (#424241) - here early feedback needed

Figma

https://www.figma.com/design/8SyoJ7QPtz7CWhOtq5hAcz/%F0%9F%A4%94-Miocene's-ideas-exploration?node-id=1882-22472&t=YbODqhKOMeMZVOQ4-1

Design exploration meetings

  • https://drive.google.com/file/d/10JwiHIZiG_kEXHE3jDyTIUBQesWNM5w8/view?usp=share_link
  • https://drive.google.com/file/d/1SJse2t8_OVG09q4eS9DWrcWjjpmOMPp2/view?usp=share_link
Edited Feb 06, 2025 by Sascha Eggenberger
Assignee Loading
Time tracking Loading