African-Ruby-Community · banta · Apr 3, 2023 · Apr 3, 2023 · Apr 3, 2023 · Apr 3, 2023
diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css
@@ -6,6 +6,22 @@
     :root {
     /*  Override colors and other variables  */
     }
+
+    h1 {
+        @apply text-2xl font-medium;
+    }
+
+    h2 {
+        @apply text-xl;
+    }
+
+    .arc_title {
+        @apply text-4xl font-bold text-red-600;
+    }
+
+    .arc_subtitle {
+        @apply py-2 text-xl font-medium leading-normal;
+    }
 }
 
 @layer components {

diff --git a/app/controllers/chapters_controller.rb b/app/controllers/chapters_controller.rb
@@ -2,7 +2,7 @@ class ChaptersController < ApplicationController
   include ActiveStorage::SetCurrent
 
   load_and_authorize_resource except: %i[ index show] # Load cancancan authorize for all actions
-  before_action :set_chapter, only: %i[ show edit update destroy ]
+  before_action :set_chapter, only: %i[ edit update destroy ]
   skip_before_action :authenticate_user!, only: %i[ index show]
 
   # GET /chapters or /chapters.json
@@ -12,6 +12,7 @@ def index
 
   # GET /chapters/1 or /chapters/1.json
   def show
+    @chapter = Chapter.find_by_slug(params[:slug])
   end
 
   # GET /chapters/new

diff --git a/app/helpers/chapters_helper.rb b/app/helpers/chapters_helper.rb
@@ -1,2 +1,17 @@
 module ChaptersHelper
+  def chapter_leader_card(chapter)
+    leader = UsersChapter.find_by(chapter_id: chapter.id, leader: true).user
+    image_tag = image_tag("https://github.com/#{leader.github_username}.png", size: "207x97")
+    name = UsersChapter.find_by_chapter(chapter.id)
+
+    content_tag(:div, class: "bg-gray-100 rounded-md shadow-md overflow-hidden inline-block") do
+      content_tag(:div, class: "h-48") do
+        image_tag
+      end +
+        content_tag(:div, class: "bg-gray-200 px-4 py-2 my-4") do
+          content_tag(:p, name, class: "text-gray-800 font-bold") +
+            content_tag(:p, leader.github_username)
+        end
+    end
+  end
 end
diff --git a/app/models/chapter.rb b/app/models/chapter.rb
@@ -1,6 +1,7 @@
 class Chapter < ApplicationRecord
   # Attachments
   has_one_attached :image
+  has_one_attached :hero_image
 
   # Associations
   belongs_to :country
@@ -16,6 +17,8 @@ class Chapter < ApplicationRecord
                                                locals: { country: self }, target: self }
   after_destroy_commit -> { broadcast_remove_to 'chapters', target: self }
 
+  before_validation :update_slug, on: [:create, :update]
+
   # Validations
   validates :name, :location, :country_id, :description, presence: true
   validates :name, uniqueness: true
@@ -27,4 +30,18 @@ class Chapter < ApplicationRecord
   #             width: 400, height: 225,
   #             message: 'is not given between dimension. It should be 400x225',
   #           }
+
+  def encoded_address
+    Addressable::URI.encode(self.location)
+  end
+
+  private
+
+  ##
+  # Update slug if the chapter name has changed
+  def update_slug
+    if name_changed?
+      self.slug = name.parameterize(separator: '-')
+    end
+  end
 end
diff --git a/app/models/users_chapter.rb b/app/models/users_chapter.rb
@@ -2,4 +2,9 @@ class UsersChapter < ApplicationRecord
   # Associations
   belongs_to :chapter
   belongs_to :user
+
+  def self.find_by_chapter(chapter_id)
+    users_chapter = find_by(chapter_id: chapter_id, leader: true)
+    users_chapter&.user&.name || 'No Leader yet'
+  end
 end
diff --git a/app/views/chapters/_chapter_leader_card.html.erb b/app/views/chapters/_chapter_leader_card.html.erb
@@ -0,0 +1,20 @@
+<div class="Speaker_Card">
+  <%= image_tag("https://github.com/#{user.github_username}.png",
+                alt: "#{user.name}'s Github photo",
+                class: 'h-[75] w-full rounded-t-lg bg-slate-200') %>
+
+  <div class="px-3">
+    <p class="arc_subtitle mt-1"><%= user.name %></p>
+
+    <!-- Socials -->
+    <div class="Speakers_Socials">
+      <div class="inline-flex justify-start space-x-4">
+        <a href="https://github.com/<%= user.github_username %>" target="_blank"
+           class="flex items-center gap-1">
+          <img src="https://anima-uploads.s3.amazonaws.com/projects/5ee3a2693990c6253bbcee4d/releases/5ee3a46b270f553c45e803b8/img/logo-github-12@1x.png" alt="" class="h-5 w-5 rounded-full"/>
+          <span><%= user.github_username %></span>
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/app/views/chapters/index.html.erb b/app/views/chapters/index.html.erb
@@ -8,19 +8,16 @@
     <% @chapters.each do |chapter| %>
       <div class="chapter-grid grid flex-grow w-45 h-48 card rounded-box
         place-items-center">
-        <%= image_tag chapter.image.attached? ? chapter.image.url : image_path('chapter.jpg'),
-                      alt: 'Local meetups photo',
-                      class: "rounded-lg rounded-tl-2xl"
-        %>
+        <%= link_to find_by_slug_chapters_path(chapter.slug) do %>
+          <%= image_tag chapter.image.attached? ? chapter.image.url : image_path('chapter.jpg'),
+                        alt: 'Local meetups photo',
+                        class: "rounded-lg rounded-tl-2xl"
+          %>
+        <% end %>
 
         <div class="container mt-4">
-          <span class="text-lg"><%= chapter.name %></span>
-
-          <% if can? :manage, chapter %>
-            <%= link_to 'Edit', edit_chapter_path(chapter), class: 'btn btn-xs btn-info',
-                        data: { turbo_frame: "edit_chapter_#{chapter.id}" } %>
-            <%= link_to 'Delete', chapter, class: 'btn btn-xs btn-error',
-                        method: :delete %>
+          <%= link_to find_by_slug_chapters_path(chapter.slug) do %>
+            <span class="text-lg"><%= chapter.name %></span>
           <% end %>
         </div>
       </div>

diff --git a/app/views/chapters/show.html.erb b/app/views/chapters/show.html.erb
@@ -1,10 +1,112 @@
-<p style="color: green"><%= notice %></p>
+<div class="container mx-auto h-full px-24 text-xl font-normal leading-normal sm:px-4">
+  <div class="Wrapper grow-1 mt-10 flex flex-col">
+    <section class="Hero__Section grid h-full gap-4 sm:grid-cols-3">
+      <div class="col-span-2">
+        <div class="ltr">
+          <% if @chapter.hero_image.present? %>
+            <%= image_tag(@chapter.hero_image, class: 'Event_thumbnail h-[200] w-full rounded-s-lg bg-gray-200') %>
+          <% else %>
+            <div class="bg-gray-200 rounded-lg w-full h-72 object-cover">
+              <p class="flex justify-center place-self-center p-2"></p>
+            </div>
+          <% end %>
+          <div class="rounded-s-lg bg-gray-200"></div>
+        </div>
+      </div>
+      <div class="h-full bg-white shadow-lg">
+        <div class="h-full p-6">
+          <div class="flex h-full flex-col justify-between">
+            <div class="space-y-4">
+              <h2 class="arc_subtitle text-red-600">Upcoming event</h2>
+              <!--              <p class="flex flex-col">-->
+              Click <a href="https://www.meetup.com/african_ruby_community/events/">here</a> for
+              upcoming events.
 
-<%= render @chapter %>
+              <div class="hidden">
+                <a href="" class="flex items-center gap-1">
+                  <span class=""
+                  ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-6 w-6">
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6"/>
+                    </svg> </span
+                  >Add to Calendar</a
+                >
+              </div>
+            </div>
 
-<div>
-  <%= link_to "Edit this chapter", edit_chapter_path(@chapter) %> |
-  <%= link_to "Back to chapters", chapters_path %>
+            <div class="hidden">
+              <button class="flex w-full items-center justify-center rounded-md bg-red-900 p-2 text-white">Attend
+                Event
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
 
-  <%= button_to "Destroy this chapter", @chapter, method: :delete %>
-</div>
+    <section class="Event__details gap-4 sm:grid-cols-3">
+      <h1 class="arc_title mt-10"><%= @chapter.name %></h1>
+
+      <div class="grid gap-4 py-10 sm:grid-cols-3">
+        <div class="col-span-2">
+          <div class="">
+            <p class="arc_subtitle">About Chapter</p>
+            <p class="arc_description"><%= sanitize(@chapter.description) %></p>
+          </div>
+          <div class="py-10">
+            <p class="arc_subtitle">Chapter Leaders</p>
+            <div>
+              <div class="cards grid grid-cols-3 gap-4">
+                <% if !UsersChapter.find_by(chapter_id: @chapter, leader: true).nil? %>
+                  <% UsersChapter.where(chapter_id: @chapter, leader: true).each do |chapter_user| %>
+                    <%= render 'chapter_leader_card', chapter: @chapter, user: chapter_user.user %>
+                  <% end %>
+                <% else %>
+                  <p>No Leaders yet</p>
+                <% end %>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="Event__Component">
+          <div class="w-full">
+            <p class="arc_subtitle">Chapter Location</p>
+            <div class="cards">
+              <div class="">
+                <!--                <img src="https://anima-uploads.s3.amazonaws.com/projects/5ee3a2693990c6253bbcee4d/releases/5ee3a46b270f553c45e803b8/img/screencapture-www-google-com-maps-1-3380006-36-6912935-15-5z-1583632512562@1x.png" alt="" class="rounded-t-lg bg-slate-200"/>-->
+                <div style="width: 100%">
+                  <iframe scrolling="no" marginheight="0" marginwidth="0"
+                          src="https://maps.google.com/maps?width=100%25&amp;height=300&amp;hl=en&amp;q=<%= @chapter.encoded_address %>&amp;t=&amp;z=14&amp;ie=UTF8&amp;iwloc=B&amp;output=embed" width="100%" height="300" frameborder="0">
+                    <a href="https://www.maps.ie/distance-area-calculator.html">area maps</a>
+                  </iframe>
+                </div>
+
+
+                <div class="">
+                  <p class="arc_subtitle mt-1"><%= @chapter.location %></p>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="mt-1">
+            <div class="Share__Component">
+              <h2 class="arc_subtitle">Share</h2>
+              <div class="my-1 flex space-x-4">
+                <%= link_to "https://www.facebook.com/sharer/sharer.php?u=#{request.original_url}" do %>
+                  <img src="https://anima-uploads.s3.amazonaws.com/projects/5ee3a2693990c6253bbcee4d/releases/5ee3a46b270f553c45e803b8/img/group-513-1@1x.png" alt="" class="h-10 w-10"/>
+                <% end %>
+
+                <%= link_to "https://twitter.com/intent/tweet" do %>
+                  <img src="https://anima-uploads.s3.amazonaws.com/projects/5ee3a2693990c6253bbcee4d/releases/5ee3a46b270f553c45e803b8/img/group-512@1x.png" alt="" class="h-10 w-10"/>
+                <% end %>
+
+                <%= link_to "https://www.linkedin.com/sharing/share-offsite/?url=#{request.original_url}" do %>
+                  <img src="https://anima-uploads.s3.amazonaws.com/projects/5ee3a2693990c6253bbcee4d/releases/5ee3a46b270f553c45e803b8/img/group-511@1x.png" alt="" class="h-10 w-10"/>
+                <% end %>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</div>
diff --git a/app/views/landing/learn.html.erb b/app/views/landing/learn.html.erb
@@ -6,7 +6,9 @@
   <p class="pt-12 text-justify" class="text-red-500">
     Take a look at our list of resources that can help you get up to speed with the Ruby programming
     language from the basic building blocks upto to the various frameworks and tools in the Ruby
-    ecosystem. If you want to add your own resources, fork this repo and send in a pull request.
+    ecosystem. If you want to add your own resources, email us
+    at <%= link_to 'organisers@rubycommunity.africa', 'mailto:organisers@rubycommunity.africa',
+                   class: 'text-red-500' %>.
   </p>
 
   <h1 class="pt-6 text-xl text-red-600 font-bold pb-2" class="text-red-500">

diff --git a/config/motor.yml b/config/motor.yml
@@ -1,13 +1,15 @@
 ---
 engine_version: 0.4.7
-file_version: 2023-03-09 16:16:17.698355000 Z
+file_version: 2023-04-03 05:50:48.235103000 Z
 resources:
 - name: chapter
   preferences:
     columns:
     - column_type: richtext
       name: description
-  updated_at: 2023-03-05 09:31:13.962854000 +00:00
+    - access_type: read_only
+      name: slug
+  updated_at: 2023-04-03 05:50:48.235103000 +00:00
 - name: feature_flag
   preferences:
     columns:
@@ -17,16 +19,9 @@ resources:
 configs:
 - key: header.links
   value:
-  - name: Reports
-    link_type: reports
-  - name: Forms
-    link_type: forms
-  - conditions: []
-    type: header
-    name: Exit admin portal
-    path: "/"
-    link_type: header
-  updated_at: 2023-03-05 09:37:51.799389000 +00:00
+  - name: "⭐ Star on GitHub"
+    path: https://github.com/motor-admin/motor-admin-rails
+  updated_at: 2023-03-30 00:41:34.130118000 +00:00
 queries: []
 dashboards: []
 forms: []
@@ -36,5 +31,5 @@ api_configs:
   name: origin
   url: "/"
   preferences: {}
-  description: 
-  updated_at: 2023-03-05 08:41:14.200426000 +00:00
+  description:
+  updated_at: 2023-03-30 00:41:34.133532000 +00:00
diff --git a/config/routes.rb b/config/routes.rb
@@ -3,7 +3,10 @@
     mount Motor::Admin => '/admin'
   end
   resources :projects
-  resources :chapters
+  resources :chapters, except: :show do
+    get ':slug', to: 'chapters#show', as: :find_by_slug, on: :collection
+  end
+
   resources :countries
   devise_for :users, controllers: {
     registrations: 'users/registrations', # Override devise registration controller

diff --git a/db/migrate/20230403051613_add_slug_to_chapters.rb b/db/migrate/20230403051613_add_slug_to_chapters.rb
@@ -0,0 +1,6 @@
+class AddSlugToChapters < ActiveRecord::Migration[7.0]
+  def change
+    add_column :chapters, :slug, :string, null: false
+    add_index :chapters, :slug, unique: true
+  end
+end
diff --git a/db/migrate/20230503174505_add_leader_to_users_chapter.rb b/db/migrate/20230503174505_add_leader_to_users_chapter.rb
@@ -0,0 +1,5 @@
+class AddLeaderToUsersChapter < ActiveRecord::Migration[7.0]
+  def change
+    add_column :users_chapters, :leader, :boolean, default: false
+  end
+end