Skip to content

Commit 5282199

Browse files
committed
WIP
1 parent aa30b9a commit 5282199

File tree

13 files changed

+113
-28
lines changed

13 files changed

+113
-28
lines changed

app/components/op_primer/component_helpers.rb

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,14 @@ def component_collection(**, &)
4646
render(OpPrimer::ComponentCollectionComponent.new(**), &)
4747
end
4848

49+
def stack(**, &)
50+
render(Primer::Alpha::Stack.new(**), &)
51+
end
52+
53+
def stack_item(**, &)
54+
render(Primer::Alpha::StackItem.new(**), &)
55+
end
56+
4957
def border_box_container(**system_args, &)
5058
Primer::Beta::BorderBox.new(position: :relative, **system_args, &)
5159
end

frontend/src/assets/sass/backlogs/_index.sass

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,5 +37,6 @@
3737
@import global_print
3838
@import jqplot
3939
@import statistics
40+
@import master_backlog
4041
@import taskboard
4142
@import dialogues
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
.date-range
2+
container-type: inline-size
3+
4+
.date-short
5+
display: none
6+
7+
@container (max-width: 80px)
8+
.date-full
9+
display: none
10+
11+
.date-short
12+
display: inline

modules/backlogs/app/components/backlogs/backlog_component.html.erb

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,12 @@ See COPYRIGHT and LICENSE files for more details.
2828
++#%>
2929

3030
<%= component_wrapper(data: wrapper_data_attributes) do %>
31-
<%= render(Primer::Beta::BorderBox.new(id: "backlog_#{backlog.sprint.id}", data: drop_target_config)) do |border_box| %>
31+
<%= render(Primer::Beta::BorderBox.new(id: dom_id(backlog), data: drop_target_config)) do |border_box| %>
3232
<% border_box.with_header do %>
33-
<%= render(Backlogs::BacklogHeaderComponent.new(border_box:, backlog:, project: @project, folded: folded?)) %>
33+
<%= render(Backlogs::BacklogHeaderComponent.new(backlog:, project: @project, folded: folded?)) %>
3434
<% end %>
3535
<% if backlog.stories.size.zero? %>
36-
<% border_box.with_body do %>
36+
<% border_box.with_row(data: { empty_list_item: true }) do %>
3737
<%=
3838
render Primer::Beta::Blankslate.new do |component|
3939
component.with_heading(tag: :h4).with_content("Backlog is empty")
@@ -42,7 +42,7 @@ See COPYRIGHT and LICENSE files for more details.
4242
%>
4343
<% end %>
4444
<% else %>
45-
<% backlog.stories.each.with_index do |story, index| %>
45+
<% backlog.stories.each do |story| %>
4646
<% border_box.with_row(
4747
id: story.id,
4848
classes: "Box-row--hover-gray Box-row--focus-blue Box-row--clickable",

modules/backlogs/app/components/backlogs/backlog_component.rb

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030

3131
module Backlogs
3232
class BacklogComponent < ApplicationComponent
33+
include OpPrimer::ComponentHelpers
3334
include OpTurbo::Streamable
3435
include RbCommonHelper
3536

@@ -43,23 +44,29 @@ def initialize(backlog:, project:, current_user: User.current)
4344
@current_user = current_user
4445
end
4546

47+
def wrapper_uniq_by
48+
backlog.id
49+
end
50+
4651
private
4752

4853
def folded? = current_user.backlogs_preference(:versions_default_fold_state) == "closed"
54+
4955
def editable? = current_user.allowed_in_project?(:edit_work_packages, @project)
5056

5157
def max_position
5258
backlog.stories.map(&:position).max
5359
end
5460

5561
def wrapper_data_attributes
56-
{ controller: "generic-drag-and-drop" }
62+
{}
5763
end
5864

5965
def drop_target_config
6066
{
6167
"is-drag-and-drop-target": true,
6268
"target-container-accessor": "& > ul",
69+
"target-id": backlog.id,
6370
"target-allowed-drag-type": "story"
6471
}
6572
end

modules/backlogs/app/components/backlogs/backlog_header_component.html.erb

Lines changed: 40 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,49 @@
11
<%= component_wrapper do %>
22
<% if show? %>
3-
<%= render(Primer::Alpha::Stack.new(border: true, direction: :horizontal, justify: :space_between)) do %>
3+
<collapsible-header class="m-0">
4+
<%= stack(direction: :horizontal, align: :center, justify: :space_between) do %>
5+
<%= stack_item(classes: "hide-when-print") do %>
6+
<%=
7+
render(
8+
Primer::BaseComponent.new(
9+
tag: :div,
10+
border: 0,
11+
data: {
12+
target: "collapsible-header.triggerElement",
13+
action: "click:collapsible-header#toggle keydown:collapsible-header#toggleViaKeyboard"
14+
}
15+
)
16+
) do
17+
%>
18+
<%= render(Primer::Beta::Octicon.new(icon: "chevron-up", hidden: @collapsed, data: { target: "collapsible-header.arrowUp" })) %>
19+
<%= render(Primer::Beta::Octicon.new(icon: "chevron-down", hidden: !@collapsed, data: { target: "collapsible-header.arrowDown" })) %>
20+
<% end %>
21+
<% end %>
22+
<%= stack_item(grow: true) do %>
23+
<%= stack(direction: :horizontal, align: :center) do %>
24+
<%= render Primer::Beta::Truncate.new(tag: :h4, font_size: 4) do %>
25+
<%= sprint.name %>
26+
<% end %>
427

5-
<%= render(Primer::Alpha::StackItem.new(grow: true)) do %>
6-
<%= render(Primer::OpenProject::BorderBox::CollapsibleHeader.new(box: border_box, collapsed:)) do |header| %>
7-
<% header.with_title(tag: :h3, font_size: 4).with_content(sprint_name) %>
8-
<% header.with_count(count: story_count) %>
9-
<% header.with_description_content(formatted_date_range) %>
28+
<%= stack_item do %>
29+
<%= render(Primer::Beta::Counter.new(count: story_count, round: true)) %>
30+
<% end %>
31+
32+
<%= stack_item(grow: true) do %>
33+
<span class="date-range">
34+
<%= formatted_date_range %>
35+
</span>
36+
<% end %>
37+
<% end %>
1038
<% end %>
11-
<% end %>
1239

13-
<%= render(Primer::Beta::Truncate.new(color: :subtle, mt: 1)) do %>
14-
<%= t(:"backlogs.points", count: story_points) %>
15-
<% end %>
16-
<%= render(Backlogs::BacklogMenuComponent.new(sprint: backlog.sprint, project: @project)) %>
40+
<%= render(Primer::Beta::Truncate.new(color: :subtle)) do %>
41+
<%= t(:"backlogs.points", count: story_points) %>
42+
<% end %>
43+
44+
<%= render(Backlogs::BacklogMenuComponent.new(sprint: backlog.sprint, project: @project)) %>
1745
<% end %>
46+
</collapsible-header>
1847
<% else %>
1948
<%=
2049
primer_form_with(

modules/backlogs/app/components/backlogs/backlog_header_component.rb

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,20 +30,20 @@
3030

3131
module Backlogs
3232
class BacklogHeaderComponent < ApplicationComponent
33+
include OpPrimer::ComponentHelpers
3334
include OpTurbo::Streamable
3435
include RbCommonHelper
3536

3637
STATE_DEFAULT = :show
3738
STATE_OPTIONS = [STATE_DEFAULT, :edit].freeze
3839

39-
attr_reader :border_box, :backlog, :project, :state, :collapsed, :current_user
40+
attr_reader :backlog, :project, :state, :collapsed, :current_user
4041

4142
delegate :sprint, :stories, to: :backlog
4243
delegate :name, to: :sprint, prefix: :sprint
4344
delegate :edit?, :show?, to: :state
4445

4546
def initialize(
46-
border_box:,
4747
backlog:,
4848
project:,
4949
state: STATE_DEFAULT,
@@ -52,14 +52,17 @@ def initialize(
5252
)
5353
super()
5454

55-
@border_box = border_box
5655
@backlog = backlog
5756
@project = project
5857
@state = ActiveSupport::StringInquirer.new(state.to_s)
5958
@collapsed = folded
6059
@current_user = current_user
6160
end
6261

62+
def wrapper_uniq_by
63+
backlog.id
64+
end
65+
6366
private
6467

6568
def story_points
@@ -76,8 +79,12 @@ def date_range
7679

7780
def formatted_date_range
7881
date_range
79-
.map { |date| tag.time(datetime: date.iso8601) { helpers.format_date(date) } }
80-
.then { |dates| safe_join(dates, " – ") }
82+
.map do |date|
83+
tag.time(datetime: date.iso8601) do
84+
safe_join([tag.span(class: "date-full") { helpers.format_date(date) },
85+
tag.span(class: "date-short") { helpers.format_date(date, format: "%m-%d") }])
86+
end
87+
end.then { |dates| safe_join(dates, " – ") }
8188
end
8289
end
8390
end

modules/backlogs/app/components/backlogs/story_component.html.erb

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
<%= render(Primer::Alpha::Stack.new(border: true, direction: :horizontal, justify: :space_between)) do %>
2-
<%= render(Primer::Alpha::StackItem.new(classes: "hide-when-print")) do %>
1+
<%= stack(direction: :horizontal, justify: :space_between) do %>
2+
<%= stack_item(classes: "hide-when-print") do %>
33
<%= render(Primer::OpenProject::DragHandle.new(draggable: true)) %>
44
<% end %>
5-
<%= render(Primer::Alpha::StackItem.new(grow: true)) do %>
5+
6+
<%= stack_item(grow: true) do %>
67
<%= render(WorkPackages::InfoLineComponent.new(work_package: story)) %>
78
<%= render(Primer::Beta::Text.new(font_weight: :semibold)) do %>
89
<%= story.subject %>

modules/backlogs/app/components/backlogs/story_component.rb

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,8 @@
3030

3131
module Backlogs
3232
class StoryComponent < ApplicationComponent
33+
include OpPrimer::ComponentHelpers
34+
3335
attr_reader :story, :sprint, :max_position, :current_user
3436

3537
def initialize(story:, sprint:, max_position:, current_user: User.current)

modules/backlogs/app/controllers/rb_sprints_controller.rb

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,6 @@ def edit_name
3535

3636
update_via_turbo_stream(
3737
component: Backlogs::BacklogHeaderComponent.new(
38-
border_box: Primer::Beta::BorderBox.new, # FIXME
3938
backlog:,
4039
project: @project,
4140
state: :edit
@@ -59,7 +58,6 @@ def update
5958

6059
update_via_turbo_stream(
6160
component: Backlogs::BacklogHeaderComponent.new(
62-
border_box: Primer::Beta::BorderBox.new, # FIXME
6361
backlog:,
6462
project: @project,
6563
state:

0 commit comments

Comments
 (0)