diff --git a/app/assets/stylesheets/tasks.css b/app/assets/stylesheets/tasks.css index 3c5a50f..392529b 100644 --- a/app/assets/stylesheets/tasks.css +++ b/app/assets/stylesheets/tasks.css @@ -28,4 +28,10 @@ .task-show-info { display: flex; flex-flow: row nowrap; + align-items: center; + gap: 0.5em; + + > * { + margin: 0; + } } diff --git a/app/assets/stylesheets/workflows.css b/app/assets/stylesheets/workflows.css new file mode 100644 index 0000000..7bc05a3 --- /dev/null +++ b/app/assets/stylesheets/workflows.css @@ -0,0 +1,26 @@ +.workflow { + --bg-color: #D1D5DB; /* Pico zinc 150 */ + --text-color: oklch(from var(--bg-color) calc(0.55 * l) calc(0.55 * c) h); + + border-radius: 1em; + background-color: var(--bg-color); + color: var(--text-color); + + display: flex; + flex-flow: row nowrap; + justify-content: center; + min-width: 2em; + padding: 0.1em 0.5em; + gap: 0.5em; + text-align: center; + + > img { + max-width: unset; + width: 1lh; + opacity: 0.6; + } + + &.red { + --bg-color: #F06048; /* Pico red 400 */ + } +} diff --git a/app/helpers/workflows_helper.rb b/app/helpers/workflows_helper.rb new file mode 100644 index 0000000..001eb1c --- /dev/null +++ b/app/helpers/workflows_helper.rb @@ -0,0 +1,8 @@ +# frozen_string_literal: true + + +module WorkflowsHelper + def workflow_display(workflow, **) + render Workflows::DisplayViewModel.new(workflow, **) + end +end diff --git a/app/view_models/tasks/statuses/selector_view_model.rb b/app/view_models/tasks/statuses/selector_view_model.rb index b9ad4e4..64fd319 100644 --- a/app/view_models/tasks/statuses/selector_view_model.rb +++ b/app/view_models/tasks/statuses/selector_view_model.rb @@ -18,7 +18,7 @@ module Tasks partial: 'tasks/status_selector', locals: { task: @task, id: dom_id, with_form: @with_form, workflow_task_statuses:, - task_status_badge: ->(status) { task_status_badge(status, view_context) }} + task_status_badge: ->(status) { task_status_badge(status, view_context) } } ) end diff --git a/app/view_models/workflows/display_view_model.rb b/app/view_models/workflows/display_view_model.rb new file mode 100644 index 0000000..9501dcb --- /dev/null +++ b/app/view_models/workflows/display_view_model.rb @@ -0,0 +1,28 @@ +# frozen_string_literal: true + +module Workflows + class DisplayViewModel + DEFAULT_ICON = 'task_line' + ICONS = { + warning: 'warning_line' + }.freeze + + def initialize(workflow, full: false) + @workflow = workflow + @full = full + end + + def icon + icon = ICONS.fetch(@workflow.icon.to_sym, DEFAULT_ICON) + + "mingcute/#{icon}.svg" + end + + def render_in(view_context) + view_context.render( + partial: 'workflows/display', + locals: @workflow.attributes.symbolize_keys.merge(icon:, full: @full) + ) + end + end +end diff --git a/app/views/tasks/_table_row.html.slim b/app/views/tasks/_table_row.html.slim index 562e0af..76cfae5 100644 --- a/app/views/tasks/_table_row.html.slim +++ b/app/views/tasks/_table_row.html.slim @@ -1,11 +1,6 @@ - cache task do tr id="task_#{task.id}" - td - / TODO: extract into a presenter (and especially add color) - - wf_icon = 'task_line' - - if task.workflow.icon == 'warning' - - wf_icon = 'warning_line' - = image_tag("mingcute/#{wf_icon}.svg", title: task.workflow.name) + td= workflow_display task.workflow td= link_to task.full_number, task_path(task) td = task_status_selector task, with_form: true diff --git a/app/views/tasks/show.html.slim b/app/views/tasks/show.html.slim index aaade18..07292a6 100644 --- a/app/views/tasks/show.html.slim +++ b/app/views/tasks/show.html.slim @@ -3,6 +3,7 @@ div h1= @task.title section.task-show-info + = workflow_display @task.workflow, full: true = task_status_selector @task, with_form: true = turbo_stream_from @task, :status, :with_form diff --git a/app/views/workflows/_display.html.slim b/app/views/workflows/_display.html.slim new file mode 100644 index 0000000..5be1e6f --- /dev/null +++ b/app/views/workflows/_display.html.slim @@ -0,0 +1,4 @@ +div.workflow class=color title=name + = image_tag(icon) + - if full + span= name