implement new wishlish page, billing profile page

internetee · Sep 12, 2023 · 314e496 · 314e496
1 parent 2d2ddd0
commit 314e496
Show file tree

Hide file tree

Showing 24 changed files with 745 additions and 316 deletions.
diff --git a/app/assets/builds/application.js b/app/assets/builds/application.js
diff --git a/app/assets/builds/application.js.map b/app/assets/builds/application.js.map
diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
@@ -1,6 +1,8 @@
 class ApplicationController < ActionController::Base
   include Pagy::Backend
 
+  helper_method :turbo_frame_request?
+
   protect_from_forgery with: :exception
   before_action :set_locale
 

diff --git a/app/controllers/billing_profiles_controller.rb b/app/controllers/billing_profiles_controller.rb
@@ -34,13 +34,17 @@ def create
   def show; end
 
   # GET /billing_profiles/aa450f1a-45e2-4f22-b2c3-f5f46b5f906b/edit
-  def edit; end
+  def edit
+    return unless turbo_frame_request?
+
+    render partial: 'form', locals: { billing_profile: @billing_profile }
+  end
 
   # PUT /billing_profiles/aa450f1a-45e2-4f22-b2c3-f5f46b5f906b
   def update
     respond_to do |format|
       if update_predicate
-        format.html { redirect_to billing_profile_path(@billing_profile.uuid), notice: t(:updated) }
+        format.html { redirect_to billing_profiles_path, notice: t(:updated) }
         format.json { render :show, status: :ok, location: @billing_profile }
       else
         format.html { render :edit }

diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
@@ -61,7 +61,11 @@ def show
   end
 
   # GET /users/aa450f1a-45e2-4f22-b2c3-f5f46b5f906b/edit
-  def edit; end
+  def edit
+    return unless turbo_frame_request?
+
+    render partial: 'form', locals: { user: @user }
+  end
 
   # PUT /users/aa450f1a-45e2-4f22-b2c3-f5f46b5f906b
   def update

diff --git a/app/controllers/wishlist_items_controller.rb b/app/controllers/wishlist_items_controller.rb
@@ -10,8 +10,14 @@ def index
 
   def edit
     @wishlist_item = WishlistItem.find_by(uuid: params[:uuid])
+    @wishlist_items = WishlistItem.for_user(current_user.id)
+
+    return unless turbo_frame_request?
+
+    render partial: 'editable', locals: { wishlist_items: @wishlist_items, wishlist_item: @wishlist_item }
   end
 
+  # rubocop:disable Metrics/AbcSize
   def create
     @wishlist_item = WishlistItem.new(strong_params)
 
@@ -20,9 +26,7 @@ def create
         format.html { redirect_to wishlist_items_path, notice: t(:created) }
         format.json { render json: @wishlist_item, status: :created }
       else
-        format.json do
-          render json: @wishlist_item.errors.full_messages, status: :unprocessable_entity
-        end
+        format.json { render json: @wishlist_item.errors.full_messages, status: :unprocessable_entity }
         format.html { redirect_to wishlist_items_path, notice: @wishlist_item.errors.full_messages.join(', ') }
       end
     end
@@ -50,31 +54,22 @@ def update
     flash[:alert] = check_for_action_restrictions(wishlist_item.domain_name)
     redirect_to wishlist_items_path and return if flash[:alert].present?
 
-    respond_to do |format|
-      if wishlist_item.update(strong_params)
-        flash.now[:notice] = 'Updated'
-        format.turbo_stream do
-          render turbo_stream: [
-            turbo_stream.append(dom_id(wishlist_item), partial: 'wishlist_items/starting_price',
-                                                       locals: { wishlist_item: wishlist_item })
-          ]
-        end
-        format.html { redirect_to wishlist_items_path }
-      else
-        flash[:alert] = I18n.t('something_went_wrong')
-        format.html { redirect_to wishlist_items_path }
-      end
+    if wishlist_item.update(strong_params)
+      redirect_to wishlist_items_path, notice: t(:updated)
+    else
+      flash[:alert] = wishlist_item.errors.full_messages.join(', ')
+      redirect_to wishlist_items_path
     end
   end
 
   # this method used by wishlist stimulus controller
   def domain_wishlist_availability
     wishlist_item = current_user.wishlist_items.build(domain_name: params[:domain_name])
-    if wishlist_item.valid?
-      msg = { status: 'fine', domain_name: params[:domain_name] }
-    else
-      msg = { status: 'wrong', domain_name: params[:domain_name], errors: wishlist_item.errors.full_messages }
-    end
+    msg = if wishlist_item.valid?
+            { status: 'fine', domain_name: params[:domain_name] }
+          else
+            { status: 'wrong', domain_name: params[:domain_name], errors: wishlist_item.errors.full_messages }
+          end
 
     render json: msg
   end

diff --git a/app/javascript/controllers/index.js b/app/javascript/controllers/index.js
@@ -7,6 +7,9 @@ import { application } from "./application"
 import Modals__OfferModalController from "./modals/offer_modal_controller";
 application.register("modals--offer-modal", Modals__OfferModalController);
 
+import Modals__ModalController from "./modals/modal_controller";
+application.register("modals--modal", Modals__ModalController);
+
 import Form__DebounceController from "./form/debounce_controller";
 application.register("form--debounce", Form__DebounceController);
 

diff --git a/app/javascript/controllers/modals/modal_controller.js b/app/javascript/controllers/modals/modal_controller.js
@@ -0,0 +1,32 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static targets = ["modal"]
+
+  connect() {
+    console.log('Modal connected');
+  }
+
+  open(event) {
+    event.preventDefault();
+
+    this.modalTarget.showModal();
+    this.modalTarget.addEventListener('click', (e) =>  this.backdropClick(e));
+
+    console.log('Modal opened');
+  }
+
+  close(event) {
+    event.preventDefault();
+
+    this.modalTarget.close();
+    console.log('Modal close');
+
+  }
+
+  backdropClick(event) {
+    event.target === this.modalTarget && this.close(event);
+    console.log('Modal close');
+
+  }
+}
diff --git a/app/views/billing_profiles/_billing_info.html.erb b/app/views/billing_profiles/_billing_info.html.erb
@@ -0,0 +1,40 @@
+<%= turbo_frame_tag dom_id(billing_profile) do %>
+  <div class="o-card">
+    <form class="c-account__form">
+      <div class="c-account__input c-account__input--editable c-account__input-title u-flex u-align-center u-content-sp u-mb-20 ">
+        <input type="text" class="o-card__title c-account__title" placeholder="" value="<%= billing_profile.name %>" readonly>
+        <div class="c-account_editicons u-flex u-align-center u-content-sp">
+          <%= button_to billing_profile_path(billing_profile.uuid), method: :delete, form: { data: { turbo_confirm: t(".confirm_delete") } }, target: '_top' do %>
+            <svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" fill="none"><path fill="#212224" d="M0 2.544a.558.558 0 0 0 .558.557h.297v6.593a1.838 1.838 0 0 0 1.836 1.836H7.31a1.838 1.838 0 0 0 1.836-1.836V3.1h.297a.558.558 0 1 0 0-1.115H7.49V1.41C7.49.633 6.857 0 6.08 0H3.92c-.777 0-1.41.632-1.41 1.41v.575H.558A.558.558 0 0 0 0 2.544ZM3.626 1.41c0-.162.132-.294.294-.294h2.16c.162 0 .294.132.294.294v.576H3.626V1.41ZM1.971 3.101H8.03v6.593a.721.721 0 0 1-.72.72H2.69a.721.721 0 0 1-.72-.72V3.1Z"/><path fill="#212224" d="M3.613 9.387a.558.558 0 0 0 .557-.558V4.688a.558.558 0 0 0-1.115 0v4.141a.558.558 0 0 0 .558.558Zm2.773 0a.558.558 0 0 0 .557-.558V4.688a.558.558 0 0 0-1.115 0v4.141a.558.558 0 0 0 .558.558Z"/></svg>
+          <% end %>
+
+          <%= link_to edit_billing_profile_path(billing_profile.uuid), data: { turbo_frame: dom_id(billing_profile) } do %>
+            <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none"><circle cx="16" cy="16" r="15.5" stroke="#E2E2E2"/><path fill="#000" d="m20.933 12.893-1.826-1.826a1.333 1.333 0 0 0-1.773-.047l-6 6c-.216.217-.35.502-.38.807l-.287 2.78a.666.666 0 0 0 .667.726h.06l2.78-.253c.304-.03.589-.165.806-.38l6-6a1.28 1.28 0 0 0-.047-1.807Zm-6.88 6.854-2 .186.18-2L16 14.213l1.8 1.8-3.747 3.734Zm4.614-4.627-1.787-1.787L18.18 12 20 13.82l-1.333 1.3Z"/></svg>
+          <% end %>
+        </div>
+      </div>
+      <div class="c-account__input c-account__input--editable u-mb-20">
+        <label for="input1"><%= t('billing_profiles.vat_code') %></label>
+        <input id="input1" type="text" placeholder="" value="<%= billing_profile.vat_code %>" readonly/>
+      </div>
+      <div class="c-account__input-wrapper u-flex u-align-start u-content-start">
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <label for="input2"><%= t('billing_profiles.street') %></label>
+          <input id="input2" type="text" placeholder="" value="<%= billing_profile.street %>" readonly/>
+        </div>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <label for="input3"><%= t('billing_profiles.city') %></label>
+          <input id="input3" type="text" placeholder="" value="<%= billing_profile.city %>" readonly/>
+        </div>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <label for="input4"><%= t('billing_profiles.postal_code') %></label>
+          <input id="input4" type="text" placeholder="" value="<%= billing_profile.postal_code %>" readonly/>
+        </div>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <label for="input5"><%= t('billing_profiles.country') %></label>
+          <input id="input4" type="text" placeholder="" value="<%= billing_profile.country_code %>" readonly/>
+        </div>
+      </div>
+    </form>
+  </div>
+<% end %>
diff --git a/app/views/billing_profiles/_form.html.erb b/app/views/billing_profiles/_form.html.erb
@@ -1,52 +1,41 @@
-<%= form_with(model: billing_profile, url: url, local: true, class: "ui form big") do |f| %>
-    <div class="ui grid stackable doubling two column">
-        <div class="column">
-            <div class="field">
-                <%= f.label :name, t('billing_profiles.name') %>
-                <%= f.text_field :name, class: "form-control" %>
-            </div>
+<%= turbo_frame_tag dom_id(billing_profile) do %>
+  <div class="o-card">
+    <%= form_with model: billing_profile, url: billing_profile_path(billing_profile.uuid), class: "c-account__form" do |f| %>
+      <div class="c-account__input c-account__input--editable c-account__input-title u-flex u-align-center u-content-sp u-mb-20 ">
+        <input type="text" class="o-card__title c-account__title" placeholder="" value="<%= billing_profile.name %>" readonly>
+        <div class="c-account_editicons u-flex u-align-center u-content-sp">
+            <%= f.button do %>
+              <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none"><circle cx="16" cy="16" r="15.5" fill="#E3FEE0" stroke="#48A23F"/><path fill="#E3FEE0" d="M8 8h16v16H8z"/><path stroke="#48A23F" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M11 15.818 14.125 19 21 12"/></svg>
+            <% end %>
 
-            <div class="field">
-                <%= f.hidden_field :user_id, value: billing_profile.user_id %>
-            </div>
+              <%= link_to '#',  data: { turbo_frame: dom_id(billing_profile) } do %>
+                                      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none"><circle cx="16" cy="16" r="15.5" fill="#FFEEE1" stroke="#FF6E00"/><path stroke="#FF6E00" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12 12 8 8M12 20l8-8"/></svg>
+              <% end %>
 
-            <div class="field">
-                <%= f.label :vat_code, t('billing_profiles.vat_code') %>
-                <%= f.text_field :vat_code, class: "form-control" %>
-            </div>
         </div>
-
-        <div class="column">
-            <div class="field">
-                <%= f.label :country %>
-                <%= f.select :country_code,
-                options_for_select(
-                    Countries.for_selection,
-                    billing_profile.country_code || Setting.find_by(code: 'default_country').retrieve
-                ),
-                {},
-                class: "ui selectable searchable dropdown" %>
-            </div>
-
-            <div class="field">
-                <%= f.label :street, t('billing_profiles.street') %>
-                <%= f.text_field :street, class: "form-control" %>
-            </div>
-
-            <div class="field">
-                <%= f.label :city, t('billing_profiles.city') %>
-                <%= f.text_field :city, class: "form-control" %>
-            </div>
-
-            <div class="field">
-                <%= f.label :postal_code, t('billing_profiles.postal_code') %>
-                <%= f.text_field :postal_code, class: "form-control" %>
-            </div>
+      </div>
+      <div class="c-account__input c-account__input--editable u-mb-20">
+        <%= f.label :vat_code, t('billing_profiles.vat_code') %>
+        <%= f.text_field :vat_code %>
+      </div>
+      <div class="c-account__input-wrapper u-flex u-align-start u-content-start">
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <%= f.label :street, t('billing_profiles.street') %>
+          <%= f.text_field :street %>
         </div>
-
-        <div class="column wide sixteen">
-            <%= f.submit t(:submit), class: "ui button primary", data: { turbo: false } %>
-            <%= link_to t(:back), :back, class: "ui button secondary" %>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <%= f.label :city, t('billing_profiles.city') %>
+          <%= f.text_field :city %>
+        </div>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <%= f.label :postal_code, t('billing_profiles.postal_code') %>
+          <%= f.text_field :postal_code %>
+        </div>
+        <div class="c-account__input c-account__input--editable u-mb-20">
+          <%= f.label :country, t('billing_profiles.country') %>
+          <%= f.text_field :country %>
         </div>
-    </div>
-<% end %>
+      </div>
+    <% end %>
+  </div>
+<% end %>
diff --git a/app/views/billing_profiles/depracated/_form.html.erb b/app/views/billing_profiles/depracated/_form.html.erb
@@ -0,0 +1,52 @@
+<%= form_with(model: billing_profile, url: url, local: true, class: "ui form big") do |f| %>
+    <div class="ui grid stackable doubling two column">
+        <div class="column">
+            <div class="field">
+                <%= f.label :name, t('billing_profiles.name') %>
+                <%= f.text_field :name, class: "form-control" %>
+            </div>
+
+            <div class="field">
+                <%= f.hidden_field :user_id, value: billing_profile.user_id %>
+            </div>
+
+            <div class="field">
+                <%= f.label :vat_code, t('billing_profiles.vat_code') %>
+                <%= f.text_field :vat_code, class: "form-control" %>
+            </div>
+        </div>
+
+        <div class="column">
+            <div class="field">
+                <%= f.label :country %>
+                <%= f.select :country_code,
+                options_for_select(
+                    Countries.for_selection,
+                    billing_profile.country_code || Setting.find_by(code: 'default_country').retrieve
+                ),
+                {},
+                class: "ui selectable searchable dropdown" %>
+            </div>
+
+            <div class="field">
+                <%= f.label :street, t('billing_profiles.street') %>
+                <%= f.text_field :street, class: "form-control" %>
+            </div>
+
+            <div class="field">
+                <%= f.label :city, t('billing_profiles.city') %>
+                <%= f.text_field :city, class: "form-control" %>
+            </div>
+
+            <div class="field">
+                <%= f.label :postal_code, t('billing_profiles.postal_code') %>
+                <%= f.text_field :postal_code, class: "form-control" %>
+            </div>
+        </div>
+
+        <div class="column wide sixteen">
+            <%= f.submit t(:submit), class: "ui button primary", data: { turbo: false } %>
+            <%= link_to t(:back), :back, class: "ui button secondary" %>
+        </div>
+    </div>
+<% end %>
diff --git a/app/views/billing_profiles/edit.html.erb → ...billing_profiles/depracated/edit.html.erb b/app/views/billing_profiles/edit.html.erb → ...billing_profiles/depracated/edit.html.erb