Add meeting columns and rows to display standup meeting (#148)

* add index page for standup meetings

* remove instance variables that are not relevant to current PR

* remove linter disable

* Add meeting columns and rows to display standup meeting

* make sure that completed meetings are populating the view components

* sacrifice to linter gods

* simplify standupmeeting controller

app/components/standup_meeting/meeting_column_component.html.erb

@@ -0,0 +1,9 @@
+<div class="collapse collapse-arrow border-l border-r border-b border-base-300 lg:w-1/3 lg:grid-rows-[4rem_1fr] lg:h-[50vh] space-y-2">
+  <input type="checkbox" class="peer h-16" checked /> 
+  <div class="collapse-title text-xl font-medium bg-primary text-primary-content h-16">
+    <%= title %>
+  </div>
+  <div class="collapse-content overflow-scroll"> 
+    <%= content %>
+  </div>
+</div>

app/components/standup_meeting/meeting_column_component.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+class StandupMeeting::MeetingColumnComponent < ViewComponent::Base
+  def initialize(title:)
+    @title = title
+  end
+
+  private
+
+  attr_reader :title
+end

app/components/standup_meeting/meeting_row_component.html.erb

@@ -0,0 +1,22 @@
+<div class="collapse collapse-arrow border-l border-r border-b space-y-2">
+  <input type="checkbox" class="peer" checked />
+  <div class="collapse-title text-xl font-medium bg-primary text-primary-content">
+    <%= standup_meeting.user.email %>
+  </div>
+  <div class="collapse-content text-neutral">
+    <div class="flex flex-col md:flex-row justify-around space-y-4 md:space-y-0 md:space-x-4 w-full pt-2">
+      <div class="flex flex-col w-1/3">
+        <span class="text-center font-bold">Yesterday</span>
+        <%= standup_meeting.yesterday_work_description %>
+      </div>
+      <div class="flex flex-col w-1/3">
+        <span class="text-center font-bold">Today</span>
+        <%= standup_meeting.today_work_description %>
+      </div>
+      <div class="flex flex-col w-1/3">
+        <span class="text-center font-bold">Blockers</span>
+        <%= standup_meeting.blockers_description %>
+      </div>
+    </div>
+  </div>
+</div>

app/components/standup_meeting/meeting_row_component.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+class StandupMeeting::MeetingRowComponent < ViewComponent::Base
+  with_collection_parameter :standup_meeting
+
+  def initialize(standup_meeting:)
+    @standup_meeting = standup_meeting
+  end
+
+  private
+
+  attr_reader :standup_meeting
+end

app/components/standup_meeting/meeting_update_component.html.erb

@@ -0,0 +1,6 @@
+<div class="border p-4 flex flex-col lg:flex-row justify-between mt-4">
+  <span class="flex flex-col justify-center mr-4 font-bold"><%= user.email %></span>
+  <span class="grow">
+    <%= standup_meeting.public_send(content_type) %>
+  </span>
+</div>

app/components/standup_meeting/meeting_update_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+class StandupMeeting::MeetingUpdateComponent < ViewComponent::Base
+  with_collection_parameter :standup_meeting
+
+  def initialize(standup_meeting:, content_type:)
+    @standup_meeting = standup_meeting
+    @content_type = content_type
+    @user = standup_meeting.user
+  end
+
+  private
+
+  attr_reader :standup_meeting, :content_type, :user
+end

app/controllers/standup_meetings_controller.rb

@@ -7,6 +7,7 @@ def index
     @standup_meetings = @standup_meeting_group.standup_meetings
                                               .includes(:user)
                                               .where(meeting_date: @meeting_date)
+    @completed_meetings = @standup_meetings.filter(&:completed?)
   end
 
   def edit

app/views/standup_meetings/index.html.erb

@@ -9,4 +9,30 @@
   <div class="py-4 flex flex-col md:flex-row justify-between">
     <h1 class="text-3xl font-bold text-center md:text-left">Standup - <%= @meeting_date %></h1>
   </div>
+  <div data-controller="tabs" data-tabs-active-tab="-mb-px border-l-2 border-t-2 border-r-2 rounded-t text-primary">
+      <a class="text-lg border-b-0 bg-white inline-block py-2 px-4" href="#"  data-tabs-target="tab" data-action="click->tabs#change">
+        <span class="hidden md:inline">View by </span>
+        <span>Status</span> 
+      </a>
+      <a class="text-lg border-b-0 bg-white inline-block py-2 px-4" href="#" data-tabs-target="tab" data-action="click->tabs#change">
+        <span class="hidden md:inline">View by </span>
+        User
+      </a>
+      <div class="divider my-0"></div>
+
+      <div class="flex flex-col lg:flex-row justify-evenly" data-tabs-target="panel">
+        <%= render StandupMeeting::MeetingColumnComponent.new(title: "Previous Work Day") do |component| %>
+          <%= render StandupMeeting::MeetingUpdateComponent.with_collection(@completed_meetings, content_type: :yesterday_work_description) %>
+        <% end %>
+        <%= render StandupMeeting::MeetingColumnComponent.new(title: "Today's Work Day") do |component| %>
+          <%= render StandupMeeting::MeetingUpdateComponent.with_collection(@completed_meetings, content_type: :today_work_description) %>
+        <% end %>
+        <%= render StandupMeeting::MeetingColumnComponent.new(title: "Blockers") do |component| %>
+          <%= render StandupMeeting::MeetingUpdateComponent.with_collection(@completed_meetings, content_type: :blockers_description) %>
+        <% end %>
+      </div>
+      <div class="hidden" data-tabs-target="panel">
+        <%= render StandupMeeting::MeetingRowComponent.with_collection(@completed_meetings) %>
+      </div>
+    </div>
 </div>