edit project modals (#638)

* edit project modals

* update bad class
This commit is contained in:
Echo 2025-11-18 10:43:35 -05:00 committed by GitHub
parent b13b5790ba
commit d8294cee77
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 76 additions and 41 deletions

View file

@ -19,7 +19,7 @@ class My::ProjectRepoMappingsController < ApplicationController
end
if @project_repo_mapping.update(project_repo_mapping_params)
redirect_to my_project_repo_mapping_path, notice: "Repository mapping updated successfully."
redirect_to my_projects_path, notice: "Repository mapping updated successfully."
else
flash.now[:alert] = @project_repo_mapping.errors.full_messages.join(", ")
render :edit, status: :unprocessable_entity

View file

@ -0,0 +1,51 @@
<%
modal_id = "edit-project-modal-#{project[:project]&.parameterize || 'unknown'}"
form_id = "edit-project-form-#{project[:project]&.parameterize || 'unknown'}"
project_name = project[:project]
repo_url = project[:repo_url] || ""
form_content = capture do
%>
<%= form_with model: ProjectRepoMapping.new,
url: my_project_repo_mapping_path(CGI.escape(project_name)),
method: :patch,
local: true,
id: form_id,
class: "w-full space-y-4" do |f| %>
<div class="space-y-2">
<%= f.label :project_name, "Project Name", class: "block text-sm font-semibold text-white" %>
<%= f.text_field :project_name,
value: project_name,
disabled: true,
class: "w-full px-4 py-3 bg-darkless text-secondary border border-darkless rounded-lg cursor-not-allowed" %>
<p class="text-xs text-gray-400">Project name cannot be changed.</p>
</div>
<div class="space-y-2 mb-4">
<%= f.label :repo_url, "Repository URL", class: "block text-sm font-semibold text-white" %>
<%= f.url_field :repo_url,
value: repo_url,
placeholder: "https://github.com/username/repo",
class: "w-full px-4 py-3 bg-darkless text-white border border-darkless rounded-lg focus:border-primary focus:outline-none transition-colors" %>
</div>
<% end %>
<% end %>
<%= render "shared/modal",
modal_id: modal_id,
title: "Edit Project Mapping",
description: "We try to autodetect your Git repository, but you can manually specify it if needed.",
max_width: "max-w-lg",
custom: form_content,
buttons: [
{
text: "Cancel",
class: "border border-gray-600 text-gray-300 hover:bg-darkless",
action: "click->modal#close"
},
{
text: "Update Project",
class: "bg-primary text-white hover:bg-red font-medium",
form: true,
form_id: form_id
}
] %>

View file

@ -1,31 +0,0 @@
<div class="min-h-screen bg-darker text-white">
<div class="max-w-6xl mx-auto px-6 py-8">
<div class="mb-8">
<h1 class="text-3xl font-bold text-primary mb-2">Edit Repository Mapping</h1>
<p class="text-secondary">Connect your project to its GitHub repository</p>
</div>
<div class="bg-dark rounded-lg p-6">
<%= form_with(model: @project_repo_mapping, url: my_project_repo_mapping_path(@project_repo_mapping.project_name), method: :patch, local: true, class: "space-y-6") do |f| %>
<div class="space-y-2">
<%= f.label :project_name, "Project Name", class: "block text-sm font-semibold text-white" %>
<%= f.text_field :project_name, value: @project_repo_mapping.project_name, disabled: true,
class: "w-full px-4 py-3 bg-darkless text-secondary border border-darkless rounded-lg cursor-not-allowed" %>
<p class="text-xs text-secondary">Project name cannot be changed</p>
</div>
<div class="space-y-2">
<%= f.label :repo_url, "Repository URL", class: "block text-sm font-semibold text-white" %>
<%= f.url_field :repo_url, placeholder: "https://github.com/username/repo",
class: "w-full px-4 py-3 bg-darkless text-white border border-darkless rounded-lg focus:border-primary focus:outline-none transition-colors" %>
<p class="text-xs text-secondary">Enter the full GitHub repository URL</p>
</div>
<div class="flex gap-4 pt-4">
<%= f.submit "Update Mapping", class: "bg-primary hover:bg-red text-white px-6 py-3 rounded-lg font-semibold transition-colors cursor-pointer" %>
<%= link_to "Cancel", root_path, class: "bg-secondary hover:bg-darkless text-white px-6 py-3 rounded-lg font-semibold transition-colors cursor-pointer" %>
</div>
<% end %>
</div>
</div>
</div>

View file

@ -38,16 +38,24 @@
<div class="flex w-full gap-2 items-center justify-center">
<% buttons.each do |button| %>
<% if button[:form] %>
<form method="post" action="<%= button[:url] %>" class="flex-1 basis-1/2 items-center justify-center w-full h-10 m-0">
<%= hidden_field_tag :authenticity_token, form_authenticity_token %>
<% if button[:method] && button[:method] != 'post' %>
<input type="hidden" name="_method" value="<%= button[:method] %>">
<% end %>
<% if button[:form_id] %>
<button type="submit"
class="w-full h-10 px-4 rounded-lg transition-colors duration-200 font-medium cursor-pointer m-0 <%= button[:class] %>">
form="<%= button[:form_id] %>"
class="flex-1 basis-1/2 items-center justify-center w-full h-10 px-4 rounded-lg transition-colors duration-200 font-medium cursor-pointer m-0 <%= button[:class] %>">
<%= button[:text] %>
</button>
</form>
<% else %>
<form method="post" action="<%= button[:url] %>" class="flex-1 basis-1/2 items-center justify-center w-full h-10 m-0">
<%= hidden_field_tag :authenticity_token, form_authenticity_token %>
<% if button[:method] && button[:method] != 'post' %>
<input type="hidden" name="_method" value="<%= button[:method] %>">
<% end %>
<button type="submit"
class="w-full h-10 px-4 rounded-lg transition-colors duration-200 font-medium cursor-pointer m-0 <%= button[:class] %>">
<%= button[:text] %>
</button>
</form>
<% end %>
<% else %>
<button type="button"
data-action="<%= button[:action] || 'click->modal#close' %>"

View file

@ -4,6 +4,9 @@
%>
<div class="grid grid-cols-[repeat(auto-fill,minmax(280px,1fr))] gap-6 mt-6">
<% project_durations.each do |project| %>
<% if current_user.github_uid.present? && project[:project].present? %>
<%= render "my/project_repo_mappings/edit_modal", project: project %>
<% end %>
<div class="bg-dark border border-primary rounded-xl p-6 shadow-lg transition-all duration-300 flex flex-col gap-4 hover:border-primary/40 hover:-translate-y-1 hover:shadow-xl backdrop-blur-sm">
<div class="flex justify-between items-start gap-3">
<div class="flex flex-col gap-2 flex-1 min-w-0">
@ -35,11 +38,15 @@
<% end %>
<% end %>
<% if current_user.github_uid.present? && project[:project].present? %>
<%= link_to edit_my_project_repo_mapping_path(project_name: CGI.escape(project[:project])), class: "p-2 rounded-lg bg-white/5 hover:bg-white/10 transition-colors duration-200", data: { turbo_frame: '_top'}, title: "Edit mapping" do %>
<% modal_id = "edit-project-modal-#{project[:project]&.parameterize || 'unknown'}" %>
<button type="button"
onclick="document.getElementById(<%= modal_id.to_json %>).dispatchEvent(new CustomEvent('modal:open'))"
class="p-2 rounded-lg bg-white/5 hover:bg-white/10 transition-colors duration-200 cursor-pointer"
title="Edit mapping">
<svg class="w-4 h-4 text-white/70" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path fill="currentColor" d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83l3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75z" />
</svg>
<% end %>
</button>
<% end %>
</div>
</div>