{% extends "base.html" %}
{% load i18n %}
{% block title %}{% translate "Manage Ruby Gems" %} - Eenos{% endblock %}
{% block content %}
    <div class="eenos-page-header flex-wrap gap-3"><div><h1 class="eenos-page-title">{% translate "Manage Ruby Gems" %}</h1><div class="eenos-page-subtitle">{% translate "Install, update, or remove gems for" %} <strong>{{ domain }}</strong>.</div></div><a href="{% url 'sandbox_ruby_gems' %}"
   class="btn btn-outline-secondary"><i data-lucide="arrow-left"></i>{% translate "Ruby Gems" %}</a></div>
    <nav class="eenos-breadcrumb"><a href="{% url 'dashboard' %}">{% translate "Dashboard" %}</a><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "Applications" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "Ruby" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><a href="{% url 'sandbox_ruby_gems' %}">{% translate "Ruby Gems" %}</a><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span class="eenos-breadcrumb-current">{{ domain }}</span></nav>
    {% include "includes/form_alerts.html" %}
    <div class="eenos-card mb-4"><div class="eenos-card-header"><div><h2 class="eenos-card-title">{% translate "Install Ruby Gems" %}</h2><p class="eenos-card-subtitle">{% translate "Add one or more gems to this application’s isolated Ruby environment." %}</p></div><div class="eenos-card-action-icon"><i data-lucide="package-plus"></i></div></div><div class="eenos-modal-info mb-4"><div class="eenos-modal-info-icon"><i data-lucide="globe-2"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "Target Ruby Application" %}</div><div class="eenos-modal-info-value"><a href="https://{{ domain }}/"
   target="_blank"
   rel="noopener noreferrer"
   class="d-inline-flex align-items-center gap-2"><span class="font-monospace text-break">{{ domain }}</span><i data-lucide="external-link"></i></a></div><div class="small text-muted mt-1">{% translate "Bundler will install these gems only in this website’s Ruby project using its selected runtime." %}</div></div></div><form method="post" id="installGemsForm" class="eenos-form">{% csrf_token %}<label for="packages" class="form-label">{% translate "Gems" %}</label><textarea name="packages"
          id="packages"
          required
          class="form-control font-monospace"
          rows="4"
          data-parsley-required-message="{% translate 'Please enter at least one gem.' %}"
          placeholder="rails:8.0.2&#10;puma&#10;rack:3.1.8"></textarea><div class="form-text">{% translate "Enter one gem per line or separate gems with commas. Add :version when a specific release is required." %}</div><input type="hidden" name="install_gems" value="yes"><button type="button" class="btn btn-primary mt-3" id="reviewInstall"><i data-lucide="package-plus"></i>{% translate "Review Installation" %}</button></form></div>
    <div class="eenos-card">
        <div class="eenos-card-header">
            <div>
                <h2 class="eenos-card-title">{% translate "Installed Gems" %}</h2>
                <p class="eenos-card-subtitle">{% translate "Gems currently installed for this application." %}</p>
            </div>
            <div class="eenos-card-action-icon">
                <i data-lucide="package-open"></i>
            </div>
        </div>
        <div class="d-flex flex-wrap align-items-center gap-2 mb-3">
            <button type="button"
                    class="btn btn-sm btn-outline-secondary"
                    id="bulkUpdate"><i data-lucide="refresh-cw"></i>{% translate "Update Selected" %}</button><button type="button" class="btn btn-sm btn-outline-danger" id="bulkRemove"><i data-lucide="trash-2"></i>{% translate "Remove Selected" %}</button>
            <a class="btn btn-sm btn-outline-primary ms-sm-auto"
               href="{% url 'sandbox_ruby_gemfile' domain=domain %}"
               title="{% translate 'Download application Gems as a Gemfile' %}"><i data-lucide="download"></i>{% translate "Download Gemfile" %}</a>
        </div>
        <div class="eenos-amber-notice eenos-amber-notice-info mb-3">
            <div class="eenos-amber-notice-icon">
                <i data-lucide="info"></i>
            </div>
            <div class="eenos-amber-notice-content">
                <div class="eenos-amber-notice-title">{% translate "Application and system Gems" %}</div>
                <div class="eenos-amber-notice-text">{% translate "Application Gems belong to this website and can be updated or removed here. System Default Gems are supplied by the selected Ruby runtime and cannot be managed from this page." %}</div>
            </div>
        </div>
        <div class="table-responsive">
            <table id="gemsTable" class="table align-middle w-100">
                <thead>
                    <tr>
                        <th>
                            <input type="checkbox"
                                   class="form-check-input"
                                   id="selectAllGems"
                                   aria-label="{% translate 'Select all gems' %}">
                        </th>
                        <th>{% translate "Gem" %}</th>
                        <th>{% translate "Version" %}</th>
                        <th>{% translate "Source" %}</th>
                        <th class="text-end">{% translate "Actions" %}</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
    <form method="post" id="updateGemForm">
        {% csrf_token %}
        <input type="hidden" name="packages" id="updateGemPackages"><input type="hidden" name="update_gem" value="yes">
    </form>
    <form method="post" id="deleteGemForm">
        {% csrf_token %}
        <input type="hidden" name="packages" id="deleteGemPackages"><input type="hidden" name="delete_gem" value="yes">
    </form>
    <div class="modal fade" id="gemModal" tabindex="-1" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><div class="modal-content"><div class="modal-header"><div><h2 class="modal-title fs-5" id="gemTitle"></h2><div class="small text-muted">{{ domain }}</div></div><button class="btn-close" data-bs-dismiss="modal"></button></div><div class="modal-body"><div class="eenos-amber-notice eenos-amber-notice-warning mb-0"><div class="eenos-amber-notice-icon"><i data-lucide="triangle-alert"></i></div><div class="eenos-amber-notice-content"><div class="eenos-amber-notice-title">{% translate "Confirm gem operation" %}</div><div class="eenos-amber-notice-text" id="gemText"></div></div></div></div><div class="modal-footer"><button class="btn btn-outline-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button><button class="btn btn-primary" id="confirmGem"></button></div></div></div></div>
{% endblock %}
{% block extra_js %}<script>(function($){"use strict";$(function(){const esc=v=>$("<div>").text(v==null?"":v).html(),modal=bootstrap.Modal.getOrCreateInstance("#gemModal");let operation="",chosen=[];
const table=$("#gemsTable").DataTable({processing:true,autoWidth:false,ajax:{url:"{% url 'ruby_gems_data' %}",data:{domain:"{{ domain|escapejs }}"},dataSrc:"data"},pageLength:25,lengthMenu:[[25,50,100,-1],[25,50,100,"{% translate 'All' %}"]],order:[],language:{lengthMenu:"{% translate '_MENU_ Rows per page' %}",loadingRecords:"&nbsp;",processing:"{% translate 'Loading...' %}",emptyTable:"{% translate 'No Ruby gems are installed.' %}",zeroRecords:"{% translate 'No matching gems found.' %}"},responsive:{details:{renderer:DataTable.Responsive.renderer.listHiddenNodes()}},columns:[{data:"selection_value",orderable:false,searchable:false,width:"34px",render:(v,t,r)=>t==="display"?'<input type="checkbox" class="form-check-input gem-select" name="member_check" value="'+esc(v)+'" '+(r.is_default?"disabled":"")+'>':v},{data:"gem",responsivePriority:1,className:"font-monospace"},{data:"version",render:(v,t)=>t==="display"?'<span class="badge eenos-badge-neutral">'+esc(v||"—")+'</span>':v},{data:"is_default",render:(v,t)=>{if(t!=="display")return v?"system":"application";return v?'<span class="badge eenos-badge-neutral" title="{% translate 'Provided by the Ruby runtime and cannot be managed from this application.' %}">{% translate "System Default" %}</span>':'<span class="badge eenos-badge-primary">{% translate "Application" %}</span>'}},{data:null,orderable:false,searchable:false,responsivePriority:1,className:"text-end",render:(d,t,r)=>{if(t!=="display"||r.is_default)return"";return'<div class="eenos-dt-actions justify-content-end"><button class="btn btn-sm btn-outline-secondary gem-action" data-action="update" data-gem="'+encodeURIComponent(r.gem)+'"><i data-lucide="refresh-cw"></i></button><button class="btn btn-sm btn-outline-danger gem-action" data-action="remove" data-gem="'+encodeURIComponent(r.selection_value)+'"><i data-lucide="trash-2"></i></button></div>'}}],drawCallback:()=>lucide.createIcons()});table.on("responsive-display",()=>lucide.createIcons());
function selected(){return $(".gem-select:checked").map((i,e)=>e.value).get()}function open(type,items){operation=type;chosen=items;const remove=type==="remove",install=type==="install",gems=items.flatMap(item=>String(item).split(/[\n,]+/)).map(item=>item.trim()).filter(Boolean),title=install?"{% translate 'Install Gems' %}":remove?"{% translate 'Remove Gems' %}":"{% translate 'Update Gems' %}";if(!$("#gemOperationDetails").length)$("#gemModal .eenos-amber-notice").before('<div id="gemOperationDetails" class="mb-4"><div class="eenos-modal-info mb-3"><div class="eenos-modal-info-icon"><i data-lucide="globe-2"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "Ruby sandbox" %}</div><div class="eenos-modal-info-value font-monospace text-break">{{ domain }}</div></div></div><div class="d-flex align-items-center justify-content-between gap-3 mb-2"><strong>{% translate "Selected gems" %}</strong><span class="badge eenos-badge-neutral" id="gemCount"></span></div><div class="d-flex flex-wrap gap-2" id="gemList"></div></div><div class="form-check mt-4 d-none" id="removeGemConfirmation"><input class="form-check-input" type="checkbox" id="removeGemConfirmed"><label class="form-check-label fw-semibold" for="removeGemConfirmed">{% translate "I understand that removing these gems may stop this Ruby application from working." %}</label></div>');$("#gemTitle").text(title);$("#gemCount").text(gems.length+" "+(gems.length===1?"{% translate 'gem' %}":"{% translate 'gems' %}"));$("#gemList").html(gems.map(item=>'<span class="badge eenos-badge-neutral font-monospace">'+esc(item)+'</span>').join(""));$("#gemModal .eenos-amber-notice-title").text(remove?"{% translate 'Gems will be uninstalled' %}":install?"{% translate 'Confirm gem installation' %}":"{% translate 'Installed versions may change' %}");$("#gemText").text(remove?"{% translate 'Removing gems may stop the application if it still depends on them.' %}":install?"{% translate 'These gems will be installed only in this application environment.' %}":"{% translate 'The selected gems will be upgraded to versions allowed by their constraints.' %}");$("#removeGemConfirmation").toggleClass("d-none",!remove);$("#removeGemConfirmed").prop("checked",false);$("#confirmGem").attr("class","btn "+(remove?"btn-danger":install?"btn-primary":"btn-warning")).prop("disabled",remove).text(title);lucide.createIcons();modal.show()}
$("#reviewInstall").on("click",function(){const f=$("#installGemsForm"),p=f.parsley();p.validate();if(p.isValid())open("install",[$("#packages").val()])});$(document).on("click",".gem-action",function(){open(this.dataset.action,[decodeURIComponent(this.dataset.gem)])});$("#bulkUpdate").on("click",function(){const a=selected();if(a.length)open("update",a.map(item=>item.split(":")[0]))});$("#bulkRemove").on("click",function(){const a=selected();if(a.length)open("remove",a)});$("#selectAllGems").on("change",function(){$(".gem-select").not(":disabled").prop("checked",this.checked)});$(document).on("change","#removeGemConfirmed",function(){$("#confirmGem").prop("disabled",!this.checked)});$("#confirmGem").on("click",function(){if(operation==="remove"&&!$("#removeGemConfirmed").is(":checked"))return;if(operation==="install"){document.getElementById("installGemsForm").submit();return}if(operation==="remove"){$("#deleteGemPackages").val(chosen.join(","));document.getElementById("deleteGemForm").submit()}else{$("#updateGemPackages").val(chosen.join(","));document.getElementById("updateGemForm").submit()}});
})})(jQuery);</script>{% endblock %}