OpenFn / OpenFn/lightning

UI to Select Dataclips on Sandbox Creation

Open
#3,593 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

sandboxes and sync
Dominant language
Elixir
Stars
296
Forks
86
Avg merge
1d 13h
Merged PRs (30d)
50

Description

We need to add a dataclip selection interface to the sandbox creation modal, allowing users to choose which named dataclips from the parent project should be copied to the new sandbox.

Currently, when creating a sandbox via Lightning.Projects.Sandboxes.provision/3, no dataclips are copied by default. The backend supports selective dataclip copying through the dataclip_ids parameter, but there's no UI to expose this functionality.

The backend already supports dataclip selection:

  • The provision_attrs includes optional dataclip_ids parameter
  • copy_selected_dataclips/3 handles filtering and copying
  • Only allows copying of named dataclips with types: :global, :saved_input, :http_request
  • Generates new UUIDs for copied dataclips in the sandbox

Consider updating the LightningWeb.SandboxLive.FormComponent to:

  • Add dataclip selection state management
  • Fetch parent project's eligible dataclips on component mount
  • Handle empty state when no dataclips are available

Consider adding a new dataclip picker component based on existing multi-select patterns in the app. The new dataclip picker component should be implemented in LightningWeb.SandboxLive.Components and used in the LightningWeb.SandboxLive.FormComponent.

Define it like this in the Components module:

def dataclip_picker(assigns) do
  # Checkbox list of available named dataclips
  # Show dataclip names, types, creation dates
  # Group by type (Global, Saved Input, HTTP Request)
  # Include search/filter functionality for large lists
  # Show "No dataclips available" empty state
end

Use it like this in the FormComponent module:

<Components.dataclip_picker 
  id="dataclip-selection"
  dataclips={@eligible_dataclips}
  selected={@selected_dataclips}
  loading={@loading_dataclips}
  on_change={...}
/>

The user experience flow should look like this:

  1. User clicks "Create Sandbox"
  2. Modal opens with basic fields (name, env, color)
  3. Dataclip section shows at bottom with loading state
  4. Available dataclips load asynchronously, grouped by type
  5. User can expand/collapse type groups and select individual dataclips
  6. Search helps users find specific dataclips by name
  7. Form submission includes selected dataclip IDs
  8. Backend copies selected dataclips to new sandbox

Few recommendations:

  • Leveraging existing @allowed_dataclip_types constant from backend
  • Using async pattern similar to other data loading in Lightning
  • Implementing virtual scrolling or pagination when there are too many dataclips to load
  • Handling errors when fetching dataclips
  • Respecting user permissions for viewing parent dataclips
  • Considering debouncing search input
  • Ensuring proper cleanup of selected dataclips when component unmounts

PS: Should we add the possibility for users to flag dataclips as eligible to be copied in Sanboxes ? For now only named dataclips are elligible to be copied in Sandboxes. cc @josephjclark

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with LightningWeb.SandboxLive.FormComponent and the LightningWeb.SandboxLive.Components module, then trace Lightning.Projects.Sandboxes.provision/3 and the existing copy_selected_dataclips/3 behavior. Done means the sandbox modal loads eligible named dataclips, supports grouped selection and filtering with an empty state, and submits selected dataclip IDs for copying.

Written by the indexing model from the issue text.

Assessment

Tech stack
elixir
Domain
backend, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.