<div class="container">
  <h1>Edit Field</h1>

  <div class="info-box" style="margin-bottom: 20px;">
    <p><strong>Schema:</strong> <%= @schema.name %></p>
    <%= if @schema.managed_by == "code" do %>
      <p style="color: #d32f2f; margin-top: 10px;">
        <strong>Warning:</strong> This schema is managed by code. Changes made here may be overwritten when the application restarts.
      </p>
    <% end %>
  </div>

  <form action={"#{@base_path}/schemas/#{@schema.id}/fields/#{@field.id}/update"} method="post" class="content-form">
    <input type="hidden" name="_csrf_token" value={Plug.CSRFProtection.get_csrf_token()} />

    <div class="form-group">
      <label for="field_name">Field Name:</label>
      <input
        type="text"
        id="field_name"
        name="field[name]"
        value={@field.name}
        required
        disabled={@schema.managed_by == "code"}
      />
      <%= if @schema.managed_by == "code" do %>
        <input type="hidden" name="field[name]" value={@field.name} />
      <% end %>
    </div>

    <div class="form-group">
      <label for="field_type">Field Type:</label>
      <select
        id="field_type"
        name="field[field_type]"
        required
        disabled={@schema.managed_by == "code"}
      >
        <option value="text" selected={@field.field_type == "text"}>Text Field</option>
        <option value="richtext" selected={@field.field_type == "richtext"}>Rich Text Field</option>
        <option value="reference" selected={@field.field_type == "reference"}>Schema Reference</option>
      </select>
      <%= if @schema.managed_by == "code" do %>
        <input type="hidden" name="field[field_type]" value={@field.field_type} />
      <% end %>
    </div>

    <%= if @field.field_type == "text" do %>
      <div class="form-group">
        <label style="display: flex; align-items: center; gap: 8px;">
          <input
            type="checkbox"
            id="field_multiline"
            name="field[multiline]"
            value="true"
            checked={Map.get(@field.options, "multiline")}
          />
          <span>Multiline (use textarea)</span>
        </label>
      </div>
    <% end %>

    <%= if @field.field_type == "reference" do %>
      <div class="form-group">
        <label for="referenced_schema_id">Referenced Schema:</label>
        <select
          id="referenced_schema_id"
          name="field[referenced_schema_id]"
          disabled={@schema.managed_by == "code"}
        >
          <option value="">Select a schema...</option>
          <%= for s <- @all_schemas do %>
            <%= if s.id != @schema.id do %>
              <option
                value={s.id}
                selected={@field.referenced_schema_id == s.id}
              ><%= s.name %></option>
            <% end %>
          <% end %>
        </select>
        <%= if @schema.managed_by == "code" do %>
          <input type="hidden" name="field[referenced_schema_id]" value={@field.referenced_schema_id} />
        <% end %>
      </div>
    <% end %>

    <div class="form-group">
      <label style="display: flex; align-items: center; gap: 8px;">
        <input
          type="checkbox"
          id="field_as_title"
          name="field[as_title]"
          value="true"
          checked={Map.get(@field.options, "as_title")}
        />
        <span>Use as title (display this field as the content title in lists)</span>
      </label>
    </div>

    <div class="actions">
      <button type="submit">Update Field</button>
      <a href={"#{@base_path}/schemas/#{@schema.id}"} class="btn-secondary">Cancel</a>
    </div>
  </form>
</div>
