activeadmin-quill_editor/docs/setup-activeadmin-gem.md

# Setting Up an ActiveAdmin 4 Extension Gem (Combustion)

This guide mirrors the working setup used in this repo: ActiveAdmin 4.0.0.beta20 + Tailwind CSS v4 + test app.

## 1. Gem Dependencies

```ruby
# Gemfile
source "https://rubygems.org"
gemspec

gem "rails", "~> 7.2"
gem "activeadmin", "4.0.0.beta20"
gem "sqlite3"
gem "puma"

gem "importmap-rails", "~> 2.0"
gem "propshaft"

gem "tailwindcss-rails", "~> 4.4.0"

group :development, :test do
  gem "combustion", "~> 1.3"
  gem "rspec-rails"
  gem "capybara"
end
```

## 2. Combustion Test App

```bash
bundle exec combust
```

## 3. config.ru Loading Order

```ruby
# config.ru
require "rubygems"
require "bundler"

Bundler.setup(:default, :development)

require "combustion"
Combustion.initialize! :active_record, :action_controller, :action_view do
  config.load_defaults Rails::VERSION::STRING.to_f if Rails::VERSION::MAJOR >= 7
end

require "importmap-rails"
require "active_admin"
require "activeadmin_quill_editor"

run Combustion::Application
```

## 4. Internal App Structure

```bash
cd spec/internal
mkdir -p app/admin app/assets/{builds,config,stylesheets} app/javascript
```

## 5. ActiveAdmin Setup

```ruby
# spec/internal/config/initializers/active_admin.rb
ActiveAdmin.setup do |config|
  config.site_title = "Test App"
  config.authentication_method = false
  config.current_user_method = false
end
```

## 6. Tailwind Input + Config

```css
/* spec/internal/app/assets/stylesheets/active_admin.tailwind.css */
@import "tailwindcss";
@config "../../../tailwind-active_admin.config.mjs";

/* Import Quill Editor CSS */
@import "activeadmin/quill_editor/quill.snow";
@import "activeadmin/quill_editor_input";
```

```javascript
// spec/internal/tailwind-active_admin.config.mjs
import { execSync } from "child_process";
import activeAdminPlugin from "@activeadmin/activeadmin/plugin";

const activeAdminPath = execSync("bundle show activeadmin", {
  encoding: "utf-8"
}).trim();

export default {
  content: [
    `${activeAdminPath}/vendor/javascript/flowbite.js`,
    `${activeAdminPath}/plugin.js`,
    `${activeAdminPath}/app/views/**/*.{arb,erb,html,rb}`,
    "./app/admin/**/*.{arb,erb,html,rb}`,
    "./app/views/**/*.{arb,erb,html,rb}`,
    "./app/javascript/**/*.js",
    "../../app/assets/**/*.{js,css}"
  ],
  darkMode: "selector",
  plugins: [activeAdminPlugin]
};
```

## 7. Tailwind Build Tasks

```ruby
# spec/internal/lib/tasks/active_admin.rake
namespace :active_admin do
  desc "Build Active Admin Tailwind stylesheets"
  task build: :environment do
    command = [
      Rails.root.join("bin/tailwindcss").to_s,
      "-i", Rails.root.join("app/assets/stylesheets/active_admin.tailwind.css").to_s,
      "-o", Rails.root.join("app/assets/builds/active_admin.css").to_s,
      "-m"
    ]

    system(*command, exception: true)
  end
end
```

## 8. Tailwind Binstub

```bash
bundle binstubs tailwindcss-ruby --force
```

## 9. JS Entry

```javascript
// spec/internal/app/javascript/active_admin.js
import "@activeadmin/activeadmin";

import Quill from "quill";
window.Quill = Quill;

import "activeadmin_quill_editor";
```

## 10. package.json (internal)

```json
{
  "name": "internal",
  "private": true,
  "scripts": {
    "build:js": "node esbuild.config.js",
    "build:css": "bundle exec rake active_admin:build",
    "build": "npm run build:js && npm run build:css"
  },
  "devDependencies": {
    "@activeadmin/activeadmin": "^4.0.0-beta20",
    "quill": "^2.0.3",
    "esbuild": "^0.24.2"
  }
}
```

## 11. ActiveAdmin 4.0.0.beta20 Notes (from upgrade guide)

**Version Requirements:**
- Rails 7.2+ (Rails 7.0 and 7.1 are no longer supported)
- Ruby 3.2+ (Ruby 3.0 and 3.1 are no longer supported)

**Breaking Changes from earlier v4 betas:**
- `_site_header.html.erb` container class changed from `sticky` to `fixed`.
- `active_admin.html.erb` adds the `pt-16` utility class.
- Tailwind v4 requires `@import "tailwindcss"` + `@config`.
- jQuery and jQuery UI removed; `columns` and `tabs` components removed.
- Replace `default_main_content` with `render "show_default"`.
- Replace `as: :datepicker` with `as: :date_picker`.
- Replace `active_admin_comments` with `active_admin_comments_for(resource)`.
- Replace `attributes_table` with `attributes_table_for(resource)` in sidebars.

**New in beta20:**
- Parent menu item linking support
- Improved comments pagination styling
- Better vertical spacing for has-many forms
- Pointer cursor restored on eligible buttons
- Various accessibility improvements