Merge pull request #14 from chonla/main

feat: Rename form

cdmm/app/controllers/cdmm_controller.rb

@@ -14,8 +14,10 @@ class CdmmController < ApplicationController
 
     def index
         form_key = generate_unique_form_key
+        default_table_title = Date.today.strftime("%B %d, %Y")
+        form_title = "Untitled - #{default_table_title}"
         # Auto create a draft
-        ev = Evaluation.new(evaluation_params.merge(form_key: form_key))
+        ev = Evaluation.new(evaluation_params.merge(form_key: form_key, title: form_title))
         ev.form_status = :draft
         if ev.save
             redirect_to evaluation_show_path(ev.form_key), notice: 'Draft evaluation was successfully created.'
@@ -38,12 +40,11 @@ def show()
     def save()
         form_key = params[:form_key]
         unless params[:form_key] or params[:form_key].present?
-            form_key = generate_unique_form_key
-            ev = Evaluation.new(evaluation_params.merge(form_key: form_key))
+            render_not_found
         else
             ev = Evaluation.find_by(form_key: params[:form_key])
             if ev
-                ev.attributes = evaluation_params # Update attributes for existing record
+                ev.attributes = evaluation_params.except(:authenticity_token) # Update attributes for existing record
             else
                 render_not_found # Handle case where form_key doesn't exist
                 return # Prevent further execution
@@ -54,11 +55,16 @@ def save()
             @table = evaluation_table(ev, form_key)
             respond_to do |format|
                 format.turbo_stream {
-                  render turbo_stream:
-                  turbo_stream
-                    .replace("evaluation_form",
-                    partial: "form_table",
-                    locals: { table: @table })
+                    render turbo_stream: [
+                        turbo_stream
+                            .replace("evaluation_form",
+                            partial: "form_table",
+                            locals: { table: @table }),
+                        turbo_stream
+                            .replace("evaluation_form_title",
+                            partial: "form_title",
+                            locals: { text: @table[:title] }),
+                    ]
                 }
                 format.html {
                     redirect_to evaluation_show_path(ev.form_key), notice: 'Evaluation was successfully created.'
@@ -77,11 +83,10 @@ def load_form_value(cell, form_data)
     end
 
     def evaluation_table(form_data = nil, form_key = nil)
-        default_table_title = Date.today.strftime("%B %d, %Y")
         table = {
             :form_key => form_key ? form_key : "",
             :form_status => :draft,
-            :title => "Untitled - #{default_table_title}",
+            :title => form_data[:title],
             :col_headers => [ "Initial", "Managed", "Defined", "Qualitatively Managed", "Optimizing" ],
             :row_headers => [ "Culture & Organization", "Build & Deploy", "Release", "Data Management", "Test & Verification", "Information & Reporting" ],
             :rows => [
@@ -664,13 +669,14 @@ def evaluation_form
             :real_time_graphs_on_deployment_pipeline_metrics,
             :dynamic_self_service_of_information,
             :customizable_dashboards,
-            :cross_reference_across_organizational_boundarie
+            :cross_reference_across_organizational_boundaries
         ]
     end
 
     def evaluation_params
         # Do not put form_status here to prevent status injection.
         params.permit(
+            :authenticity_token,
             :form_key, # Make sure to permit form_key
             :title,
             *evaluation_form

cdmm/app/javascript/controllers/editable_label_controller.js

@@ -0,0 +1,30 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="editable-label"
+export default class extends Controller {
+  static values = { identifier: String, original: String };
+  static targets = [ 'textViewer', 'textEditor', 'textEditorInput' ];
+
+  connect() {
+    this.openViewer();
+  }
+
+  openViewer() {
+    this.textViewerTarget.classList.remove('hidden');
+    this.textEditorTarget.classList.remove('inline-flex');
+    this.textEditorTarget.classList.add('hidden');
+  }
+
+  openEditor() {
+    this.textViewerTarget.classList.add('hidden');
+    this.textEditorTarget.classList.remove('hidden')
+    this.textEditorTarget.classList.add('inline-flex');
+    this.textEditorInputTarget.focus();
+  }
+
+  submit() {
+    this.textViewerTarget.innerHTML = this.textEditorInputTarget.value;
+    this.openViewer();
+    this.dispatch('changed', { detail: { original: this.originalValue, new: this.textEditorInputTarget.value }, prefix: this.identifierValue });
+  }
+}

cdmm/app/views/cdmm/_cdmm_form.html.erb

@@ -1,11 +1,11 @@
-<%= form_with url: evaluation_save_path, method: :post, data: { controller: "auto-submit", action: "capability:toggled@window->auto-submit#dirty capability:toggled@window->auto-submit#submit", turbo_stream: true } do |form|  %>
+<%= form_with url: evaluation_save_path, method: :post, data: { controller: "auto-submit", action: "capability:toggled@window->auto-submit#dirty capability:toggled@window->auto-submit#submit title:changed@window->auto-submit#dirty title:changed@window->auto-submit#submit", turbo_stream: true } do |form|  %>
     <% if table[:form_key] %>
     <input type="hidden" name="form_key" value="<%= table[:form_key] %>">
     <% end %>
     <div class="flex flex-row justify-between items-center mb-2">
         <div class="flex flex-col">
             <div class="flex flex-row justify-start items-center gap-x-2">
-                <h1 class="noto-serif-thai-bold text-xl md:text-2xl lg:text-3xl leading-normal lg:leading-relaxed"><%= table[:title] %></h1>
+                <%= render "form_title", text: table[:title] %>
                 <div data-auto-submit-target="savingIcon" class="h-5 md:h-6 lg:h-8 flex flex-row gap-x-1 items-baseline">
                     <svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" class="text-slate-500" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;">
                         <g transform="translate(0, -2) matrix(1.01508,0,0,1,0.0940615,0.0723927)">

cdmm/app/views/cdmm/_form_title.html.erb

@@ -0,0 +1,3 @@
+<%= turbo_frame_tag "evaluation_form_title", data: { turbo_cache_control: "no-cache" } do %>
+    <%= render "shared/editable_title", input_name: :title, text: text, identifier: :title %>
+<% end %>

cdmm/app/views/shared/_editable_title.html.erb

@@ -0,0 +1,24 @@
+<div data-controller="editable-label" data-editable-label-identifier-value="<%= identifier %>" data-editable-label-original-value="<%= h(text) %>">
+    <div class="flex flex-row justify-start items-center space-x-1 flex-nowrap cursor-pointer group" data-editable-label-target="textViewer" data-action="click->editable-label#openEditor">
+        <h1 class="underline decoration-dashed decoration-gray-300 decoration-2 noto-serif-thai-bold text-xl md:text-2xl lg:text-3xl leading-normal lg:leading-relaxed"><%= text %></h1>
+        <div class="text-gray-300 h-6 w-6 block">
+            <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M883.626667 300.373333c16.64-16.64 16.64-44.373333 0-60.16l-99.84-99.84c-15.786667-16.64-43.52-16.64-60.16 0l-78.506667 78.08 160 160M128 736V896h160L759.893333 423.68l-160-160L128 736z" fill="currentColor" /></svg>
+        </div>
+    </div>
+    <div class="inline-flex flex-row items-center rounded-md border shadow-sm border-gray-400 p-0 pr-1 space-x-1" data-editable-label-target="textEditor">
+        <input type="text" name="<%= input_name %>" class="text-xl md:text-2xl lg:text-3xl border-none outline-none bg-transparent px-2 py-1 focus:outline-none focus:ring-transparent" value="<%= h(text) %>"  data-editable-label-target="textEditorInput" />
+        <button type="submit" class="text-lime-600 h-6 w-6" data-action="click->editable-label#submit">
+            <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                <circle cx="12" cy="12" r="12" fill="currentColor" />
+                <path d="M7 12l4 4l6 -8" fill="none" stroke-linejoin="round" stroke-width="4" stroke-linecap="round" stroke="white" />
+            </svg>
+        </button>
+        <button class="h-6 w-6 text-red-600" data-action="click->editable-label#openViewer">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                <circle cx="12" cy="12" r="12" fill="currentColor" />
+                <path d="M7 7l10 10" fill="none" stroke-linejoin="round" stroke-width="4" stroke-linecap="round" stroke="white" />
+                <path d="M17 7l-10 10" fill="none" stroke-linejoin="round" stroke-width="4" stroke-linecap="round" stroke="white" />
+            </svg>
+        </button>
+    </div>
+</div>

cdmm/db/migrate/20241022142702_add_form_title.rb

@@ -0,0 +1,5 @@
+class AddFormTitle < ActiveRecord::Migration[7.2]
+  def change
+    add_column :evaluations, :title, :string
+  end
+end