madmin 1.2.11 → 2.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 56db4d11f4d580cf81ae930792f465deefff47373903e5f98503d53314e30eeb
-  data.tar.gz: 7fbf045417bde2b39a4abcf98f86900dd60d3e7e99670139e1fdbec9a1ecf43d
+  metadata.gz: 531eb134ff2fc5b4f8d16f24167561fcd7836f1f5e8886d39f103a156ccffc6b
+  data.tar.gz: 28cec8a6ae99f9a36e6ecdc65383fe10306f2880ec7ae499e08a50093b38b7e1
 SHA512:
-  metadata.gz: 047cd4d1eceabc2328638b13ee9cb59225b563bd396c02887e89b6a4f6aae3fab5ce38252e7d35981feb1e6cbd76bbc5058c3d9fe686577705a4c48720a9903c
-  data.tar.gz: 96340f347076e77f481482fd1f34fcac7fcb4d3bd22d62ba22957ac58f14375e5641cb8dac30fff8f9c0ac963d1be5e220df3c721666978b4341ec958953094c
+  metadata.gz: 122ff7eda3d0bc65945b4e34b9b23d6ddc700d711b9fa7381e8c3fd9bdfcd73113a083f2dcaded130978b6716bf79e3233bcc0e132c80704436b42d5065d407b
+  data.tar.gz: 92e06ee0cfcba0279947e46972efc5f2463b35b020b97bc5d830f7554cf5b004cc242f4203d3cc124919df49d8ecf1a4b16ac1e94b5e70715961b8e2afa8a1aa

data/README.md

@@ -6,14 +6,15 @@
 
 Why another Ruby on Rails admin? We wanted an admin that was:
 
-* Familiar and customizable like Rails scaffolds (less DSL)
-* Supports all the Rails features out of the box (ActionText, ActionMailbox, has_secure_password, etc)
-* Stimulus / Turbolinks / Hotwire ready
+- Familiar and customizable like Rails scaffolds (less DSL)
+- Supports all the Rails features out of the box (ActionText, ActionMailbox, has_secure_password, etc)
+- Stimulus / Turbolinks / Hotwire ready
 
 ![Madmin Screenshot](docs/images/screenshot.png)
 _We're still working on the design!_
 
 ## Installation
+
 Add `madmin` to your application's Gemfile:
 
 ```bash
@@ -40,6 +41,23 @@ To generate a resource for a model, you can run:
 rails g madmin:resource ActionText::RichText
 ```
 
+### Avoid N+1 queries
+
+In case of N+1 queries, you can preload the association by overriding the `scoped_resource` method in the controller:
+
+```ruby
+module Madmin
+  class PostsController < Madmin::ResourceController
+    private
+
+    def scoped_resources
+      super.includes(:user)
+    end
+  end
+end
+
+```
+
 ## Configuring Views
 
 The views packaged within the gem are a great starting point, but inevitably people will need to be able to customize those views.
@@ -47,16 +65,19 @@ The views packaged within the gem are a great starting point, but inevitably peo
 You can use the included generator to create the appropriate view files, which can then be customized.
 
 For example, running the following will copy over all of the views into your application that will be used for every resource:
+
 ```bash
 rails generate madmin:views
 ```
 
-The view files that are copied over in this case includes all of the standard Rails action views (index, new, edit, show, and _form), as well as:
-* `application.html.erb` (layout file)
-* `_javascript.html.erb` (default JavaScript setup)
-* `_navigation.html.erb` (renders the navigation/sidebar menu)
+The view files that are copied over in this case includes all of the standard Rails action views (index, new, edit, show, and \_form), as well as:
+
+- `application.html.erb` (layout file)
+- `_javascript.html.erb` (default JavaScript setup)
+- `_navigation.html.erb` (renders the navigation/sidebar menu)
 
 As with the other views, you can specifically run the views generator for only the navigation or application layout views:
+
 ```bash
 rails g madmin:views:navigation
  # -> app/views/madmin/_navigation.html.erb
@@ -68,6 +89,7 @@ rails g madmin:views:layout  # Note the layout generator includes the layout, ja
 ```
 
 If you only need to customize specific views, you can restrict which views are copied by the generator:
+
 ```bash
 rails g madmin:views:index
  # -> app/views/madmin/application/index.html.erb
@@ -79,6 +101,7 @@ The `attribute` method in model_resource.rb gives you that flexibility.
 ```bash
  # -> app/madmin/resources/book_resource.rb
 ```
+
 ```ruby
 class UserResource < Madmin::Resource
   attribute :id, form: false
@@ -91,6 +114,7 @@ end
 ```
 
 You can also scope the copied view(s) to a specific Resource/Model:
+
 ```bash
 rails generate madmin:views:index Book
  # -> app/views/madmin/books/index.html.erb
@@ -126,9 +150,14 @@ end
 You can use a couple of strategies to authenticate users who are trying to
 access your madmin panel: [Authentication Docs](docs/authentication.md)
 
+## Assets
+You can customize the JavaScript and CSS assets used by Madmin for your application. To learn how
+see the [Assets Doc](docs/assets.md)
+
 ## 🙏 Contributing
 
 This project uses Standard for formatting Ruby code. Please make sure to run standardrb before submitting pull requests.
 
 ## 📝 License
+
 The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/app/assets/config/madmin_manifest.js

@@ -0,0 +1,3 @@
+//= link_directory ../stylesheets/madmin .css
+//= link_directory ../../javascript/madmin .js
+//= link_tree ../../javascript/madmin/controllers .js

data/app/assets/stylesheets/madmin/actiontext.css

@@ -0,0 +1,31 @@
+/*
+ * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
+ * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
+ * inclusion directly in any other asset bundle and remove this file.
+ *
+ *= require trix
+*/
+
+/*
+ * We need to override trix.css’s image gallery styles to accommodate the
+ * <action-text-attachment> element we wrap around attachments. Otherwise,
+ * images in galleries will be squished by the max-width: 33%; rule.
+*/
+.trix-content .attachment-gallery > action-text-attachment,
+.trix-content .attachment-gallery > .attachment {
+  flex: 1 0 33%;
+  padding: 0 0.5em;
+  max-width: 33%;
+}
+
+.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
+  flex-basis: 50%;
+  max-width: 50%;
+}
+
+.trix-content action-text-attachment .attachment {
+  padding: 0 !important;
+  max-width: 100% !important;
+}

data/app/assets/stylesheets/madmin/application-sprockets.css

@@ -0,0 +1,11 @@
+/*
+ *= require trix
+ *= require madmin/actiontext
+ *= require madmin/reset
+ *= require madmin/base
+ *= require madmin/sidebar
+ *= require madmin/buttons
+ *= require madmin/forms
+ *= require madmin/tables
+ *= require madmin/pagination
+*/

data/app/assets/stylesheets/madmin/application.css

@@ -0,0 +1,10 @@
+@import url("/trix.css");
+@import url("/madmin/actiontext.css");
+@import url("/madmin/reset.css");
+@import url("/madmin/base.css");
+@import url("/madmin/sidebar.css");
+@import url("/madmin/buttons.css");
+@import url("/madmin/forms.css");
+@import url("/madmin/tables.css");
+@import url("/madmin/pagination.css");
+

data/app/assets/stylesheets/madmin/base.css

@@ -0,0 +1,117 @@
+:root {
+  --primary-color: rgb(37 99 235);
+  --border-color: rgb(229 231 235);
+  --background-color: rgb(249 250 251);
+  --text-color: rgb(2 6 23);
+  --light-text-color: rgb(71 85 105);
+  --sidebar-width: 16rem;
+}
+
+body {
+  color: var(--text-color);
+  font-size: 14px;
+}
+
+a {
+  color: var(--primary-color);
+}
+
+.alert {
+  border-radius: 0.5rem;
+  font-weight: 500;
+  padding: 1rem;
+  margin-bottom: 1rem;
+
+  ul {
+    margin-top: 0.5rem;
+    margin-bottom: 0;
+    padding-left: 2rem;
+  }
+
+  svg {
+    display: inline-block;
+    height: 1rem;
+    margin-right: 0.25rem;
+    width: 1rem;
+    vertical-align: text-bottom;
+  }
+
+  &.alert-danger {
+    background-color: oklch(.936 .032 17.717);
+    color: oklch(.444 .177 26.899);
+
+    svg {
+      color: oklch(.637 .237 25.331);
+    }
+  }
+
+  &.alert-notice {
+    background-color: oklch(.962 .044 156.743);
+    color: oklch(.448 .119 151.328);
+
+    svg {
+      color: oklch(.723 .219 149.579);
+    }
+  }
+}
+
+.search {
+  display: flex;
+  align-items: center;
+}
+
+.header {
+  border-bottom: 1px solid rgb(229 231 235);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 1rem;
+  margin-bottom: 1rem;
+
+  h1 {
+    margin: 0;
+  }
+
+  a {
+    text-decoration: none;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+
+  .actions {
+    align-items: center;
+    display: flex;
+    gap: 0.5rem;
+  }
+}
+
+.metrics {
+  display: flex;
+
+  .metric {
+    border: 1px solid rgb(229 231 235);
+    border-radius: 0.25rem;
+    padding: 1rem;
+    margin: 1rem;
+    flex: 1 1 0%;
+
+    h4 {
+      color: rgb(75 85 99);
+      font-weight: 600;
+      margin-top: 0;
+      margin-bottom: 0.5rem;
+    }
+
+    p {
+      font-size: 2rem;
+      font-weight: 600;
+      margin: 0;
+    }
+  }
+}
+
+.scopes {
+  margin-bottom: 1rem;
+}

data/app/assets/stylesheets/madmin/buttons.css

@@ -0,0 +1,46 @@
+.btn {
+  border-radius: 0.375rem;
+  display: inline-block;
+  font-weight: 600;
+  text-decoration: none;
+
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  padding-bottom: 0.5rem;
+  padding-top: 0.5rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+
+  &:hover {
+    text-decoration: none !important;
+  }
+
+  &.btn-primary {
+    background-color: var(--primary-color);
+    color: white;
+  }
+
+  &.btn-secondary {
+    background-color: white;
+    color: rgb(31 41 55);
+    box-shadow: inset 0 0 0 1px rgb(156 163 175);
+
+    &:hover {
+      background-color: rgb(243 244 246);
+    }
+
+    &.active {
+      background-color: rgb(243 244 246);
+    }
+  }
+
+  &.btn-danger {
+    background-color: white;
+    color: rgb(239 68 68);
+    box-shadow: inset 0 0 0 1px rgb(239 68 68);
+
+    &:hover {
+      background-color: rgb(243 244 246);
+    }
+  }
+}

data/app/assets/stylesheets/madmin/forms.css

@@ -0,0 +1,64 @@
+.form-hint {
+  font-size: 0.875rem;
+  margin-top: 0.5rem;
+
+  &.error {
+    color: rgb(239 68 68);
+  }
+}
+
+.form-group {
+  margin-bottom: 1rem;
+}
+
+.form-input {
+  width: 100%;
+}
+
+.form-description {
+  color: var(--light-text-color);
+}
+
+label {
+  color: rgb(17 24 39);
+  line-height: 1.5rem;
+  font-weight: 500;
+  font-size: 0.875rem;
+}
+
+button, input, optgroup, select, textarea {
+  font-family: inherit;
+  font-feature-settings: inherit;
+  font-variation-settings: inherit;
+  font-size: 100%;
+  font-weight: inherit;
+  line-height: inherit;
+  letter-spacing: inherit;
+  color: inherit;
+  margin: 0;
+  padding: 0;
+}
+
+[type='text'], input:where(:not([type])), [type='email'], [type='url'], [type='password'], [type='number'], [type='date'], [type='datetime-local'], [type='month'], [type='search'], [type='tel'], [type='time'], [type='week'], [multiple], textarea, select {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  background-color: #fff;
+
+  border-radius: 0.375rem;
+  box-shadow: inset 0 0 0 1px rgb(156 163 175);
+  line-height: 1.5rem;
+  padding-bottom: 0.375rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+  padding-top: 0.375rem;
+
+  &:focus {
+    box-shadow: inset 0 0 0 1px rgb(var(--primary-color));
+  }
+}
+
+.required {
+  color: rgb(239 68 68);
+  font-weight: 600;
+}

data/app/assets/stylesheets/madmin/pagination.css

@@ -0,0 +1,59 @@
+.pagination {
+  padding: 0.5rem;
+}
+
+.pagy {
+  display: inline-flex;
+  isolation: isolate;
+  border-radius: 0.375rem;
+
+  a {
+    display: inline-flex;
+    position: relative;
+    padding-top: 0.5rem;
+    padding-bottom: 0.5rem;
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+    align-items: center;
+    box-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+    --tw-ring-inset: inset;
+    --tw-ring-color: #D1D5DB;
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    color: #111827;
+    background-color: #ffffff;
+    border-radius: 0.25rem;
+    text-decoration: none;
+  }
+
+  a:hover {
+    background-color: #F3F4F6;
+  }
+
+  a:not([href]) {
+    color: #D1D5DB;
+    cursor: default;
+  }
+
+  a.current {
+    color: #ffffff;
+    background-color: var(--primary-color);
+  }
+
+  label {
+    display: inline-block;
+    padding-top: 0.125rem;
+    padding-bottom: 0.125rem;
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+    border-radius: 0.5rem;
+    white-space: nowrap;
+    background-color: #E5E7EB;
+  }
+
+  label input {
+    border-radius: 0.375rem;
+    border-style: none;
+    background-color: #F3F4F6;
+  }
+}

data/app/assets/stylesheets/madmin/reset.css

@@ -0,0 +1,242 @@
+*, ::before, ::after {
+  box-sizing: border-box;
+  border-width: 0;
+  border-style: solid;
+  border-color: #e5e7eb;
+}
+
+body {
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+img, picture, video, canvas, svg {
+  display: block;
+  max-width: 100%;
+}
+input, button, textarea, select {
+  font: inherit;
+}
+p, h1, h2, h3, h4, h5, h6 {
+  overflow-wrap: break-word;
+}
+p {
+  text-wrap: pretty;
+}
+h1, h2, h3, h4, h5, h6 {
+  text-wrap: balance;
+}
+
+/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
+
+/*
+Document
+========
+*/
+
+/**
+Use a better box model (opinionated).
+*/
+
+*,
+::before,
+::after {
+	box-sizing: border-box;
+}
+
+html {
+	/* Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3) */
+	font-family:
+		system-ui,
+		'Segoe UI',
+		Roboto,
+		Helvetica,
+		Arial,
+		sans-serif,
+		'Apple Color Emoji',
+		'Segoe UI Emoji';
+	line-height: 1.15; /* 1. Correct the line height in all browsers. */
+	-webkit-text-size-adjust: 100%; /* 2. Prevent adjustments of font size after orientation changes in iOS. */
+	tab-size: 4; /* 3. Use a more readable tab size (opinionated). */
+}
+
+/*
+Sections
+========
+*/
+
+body {
+	margin: 0; /* Remove the margin in all browsers. */
+}
+
+/*
+Text-level semantics
+====================
+*/
+
+/**
+Add the correct font weight in Chrome and Safari.
+*/
+
+b,
+strong {
+	font-weight: bolder;
+}
+
+/**
+1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
+2. Correct the odd 'em' font sizing in all browsers.
+*/
+
+code,
+kbd,
+samp,
+pre {
+	font-family:
+		ui-monospace,
+		SFMono-Regular,
+		Consolas,
+		'Liberation Mono',
+		Menlo,
+		monospace; /* 1 */
+	font-size: 1em; /* 2 */
+}
+
+/**
+Add the correct font size in all browsers.
+*/
+
+small {
+	font-size: 80%;
+}
+
+/**
+Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
+*/
+
+sub,
+sup {
+	font-size: 75%;
+	line-height: 0;
+	position: relative;
+	vertical-align: baseline;
+}
+
+sub {
+	bottom: -0.25em;
+}
+
+sup {
+	top: -0.5em;
+}
+
+/*
+Tabular data
+============
+*/
+
+/**
+Correct table border color inheritance in Chrome and Safari. (https://issues.chromium.org/issues/40615503, https://bugs.webkit.org/show_bug.cgi?id=195016)
+*/
+
+table {
+	border-color: currentcolor;
+}
+
+/*
+Forms
+=====
+*/
+
+/**
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+*/
+
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit; /* 1 */
+	font-size: 100%; /* 1 */
+	line-height: 1.15; /* 1 */
+	margin: 0; /* 2 */
+}
+
+/**
+Correct the inability to style clickable types in iOS and Safari.
+*/
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+	-webkit-appearance: button;
+}
+
+/**
+Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
+*/
+
+legend {
+	padding: 0;
+}
+
+/**
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+progress {
+	vertical-align: baseline;
+}
+
+/**
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+	height: auto;
+}
+
+/**
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+
+[type='search'] {
+	-webkit-appearance: textfield; /* 1 */
+	outline-offset: -2px; /* 2 */
+}
+
+/**
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+
+::-webkit-search-decoration {
+	-webkit-appearance: none;
+}
+
+/**
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to 'inherit' in Safari.
+*/
+
+::-webkit-file-upload-button {
+	-webkit-appearance: button; /* 1 */
+	font: inherit; /* 2 */
+}
+
+/*
+Interactive
+===========
+*/
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+summary {
+	display: list-item;
+}