Merge pull request #236 from ontoportal-lirmm/feature/lookbook

Feature: Add Lookbook to preview components
ontoportal-lirmm · Sep 5, 2023 · 15302b0 · 15302b0
1 parent 95535c4
commit 15302b0
Show file tree

Hide file tree

Showing 8 changed files with 44 additions and 5 deletions.
diff --git a/Gemfile b/Gemfile
@@ -69,6 +69,7 @@ gem 'rest-client'
 gem 'stackprof', require: false
 gem 'thin'
 gem 'view_component', '~> 2.72'
+gem "lookbook"
 gem 'turnout'
 gem 'will_paginate', '~> 3.0'
 

diff --git a/app/components/card_message_component.rb b/app/components/card_message_component.rb
@@ -1,10 +1,10 @@
 class CardMessageComponent < ViewComponent::Base
-    def initialize(title: nil ,message:, button_text: nil, type:)
+    def initialize(title: nil ,message:, button_text: nil, button_link: "/" ,type:)
         @title = title
         @message = message
         @button_text = button_text
         @type = type
-
+        @button_link = button_link
     end
 
     def no_title?

diff --git a/app/components/card_message_component/card_message_component.html.haml b/app/components/card_message_component/card_message_component.html.haml
@@ -13,8 +13,8 @@
     - unless no_button?
       - case @type
       - when "success"
-        %a.card-message-button.card-message-button-success{:href => "/"}
+        %a.card-message-button.card-message-button-success{:href => @button_link}
           = @button_text
       - when "failure"
-        %a.card-message-button.card-message-button-failure{:href => "/"}
+        %a.card-message-button.card-message-button-failure{:href => @button_link}
           = @button_text
diff --git a/app/views/layouts/component_preview.html.erb b/app/views/layouts/component_preview.html.erb
@@ -0,0 +1,12 @@
+<html>
+<head>
+  <title>Component Preview</title>
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <%= stylesheet_link_tag "application" %>
+</head>
+<body style="margin: 20px">
+
+    <%= yield %> <!-- rendered preview will be injected here -->
+
+</body>
+</html>
diff --git a/config/application.rb b/config/application.rb
@@ -27,5 +27,8 @@ class Application < Rails::Application
     config.change_request = config_for :change_request
 
     config.generators.template_engine = :haml
+
+    # Set the default layout to app/views/layouts/component_preview.html.erb
+    config.view_component.default_preview_layout = "component_preview"
   end
 end
diff --git a/config/routes.rb b/config/routes.rb
@@ -207,5 +207,6 @@
   get '/visualize' => 'ontologies#visualize', :as => :visualize_concept, :constraints => { ontology: /[^\/?]+/, id: /[^\/?]+/, ontologyid: /[^\/?]+/, conceptid: /[^\/?]+/ }
 
   get '/exhibit/:ontology/:id' => 'concepts#exhibit'
-
+
+  mount Lookbook::Engine, at: "/lookbook"
 end
diff --git a/test/components/previews/card_message_component_preview.rb b/test/components/previews/card_message_component_preview.rb
@@ -0,0 +1,12 @@
+class CardMessageComponentPreview < ViewComponent::Preview
+
+    # @param message text
+    # @param button_text text
+    # @param type select [success, failure]
+    # @param button_link text
+
+    def default(message: "Here we can type a success or failure message to the user", button_text: "Do action", type: "success", button_link: "/" )
+        render(CardMessageComponent.new(message: message, button_text: button_text, type: type, button_link: button_link))
+    end
+
+  end
diff --git a/test/components/previews/chips_component_preview.rb b/test/components/previews/chips_component_preview.rb
@@ -0,0 +1,10 @@
+class ChipsComponentPreview < ViewComponent::Preview
+
+    # @param name text
+    # @param value text
+
+    def default(name: "name", value: "value")
+        render(ChipsComponent.new(name: name, value: value))
+    end
+
+  end