added the media library and tweaked markdown

Author: adrianthedev

docs/.vitepress/config.js

@@ -232,6 +232,12 @@ const config = {
             {text: "TailwindCSS integration", link: "/3.0/tailwindcss-integration.html"},
           ],
         },
+        {
+          text: "Media Library",
+          items: [
+            {text: "Overview", link: "/3.0/media-library.html"},
+          ]
+        },
         {
           text: "Performance",
           items: [

docs/.vitepress/getFiles.js

@@ -24,6 +24,9 @@ const getFiles = (directory, version) => {
       if (text === 'Easy mde') {
         text = 'Easy MDE'
       }
+      if (text === 'Tip tap') {
+        text = 'Tip Tap'
+      }
       const link = `/${version}/${directory}/${path.replace('.md', '.html')}`
       return {text, link}
     })

docs/3.0/common/field_options/always_show.md

@@ -0,0 +1,6 @@
+<Option name="`always_show`">
+
+By default, the content of the field is not visible on the `Show` view; instead, it's hidden under a `Show Content` link that, when clicked, displays the content. You can set it to display the content by setting `always_show` to `true`.
+
+<!-- @include: ./../default_boolean_false.md-->
+</Option>

docs/3.0/fields/markdown.md

@@ -1,92 +1,66 @@
 ---
-version: '3.17'
+version: '3.17.0'
 license: community
+betaStatus: Beta
 ---
 
 # Markdown
 
 :::info
-In Avo 3.17 we renamed the `markdown` field `easy_mde` and introduced this custom one.
+In Avo 3.17 we renamed the `markdown` field `easy_mde` and introduced this custom one based on the [Marksmith editor](https://github.com/avo-hq/marksmith).
+
+Please read the docs on the repo for more information on how it works.
 :::
 
 This field is inspired by the wonderful GitHub editor we all love and use.
 
-It supports applying styles to the markup and dropping files in the editor. The file will be taken over by Rails and persisted using Active Storage.
-
+It supports applying styles to the markup, dropping files in the editor, and using the [Media Library](./media-library).
+The uploaded files will be taken over by Rails and persisted using Active Storage.
 
 ```ruby
 field :body, as: :markdown
 ```
 
 :::warning
-Please add these gems to your `Gemfile`.
+Please ensure you have these gems in your `Gemfile`.
 
 ```ruby
-gem "avo-markdown_field"
-gem "redcarpet"
+gem "marksmith"
 ```
 :::
 
-## Customize the parser & renderer
+## Customize the renderer
 
 There are two places where we parse the markdown into the HTML you see.
 
 1. In the controller
 2. In the <Show /> field component
 
-You may customize the renderer by overriding the implementation.
-
-### Everywhere
-
-Both parsers inherit from the same parser from the field. So you can override in the field and it will be visible everywhere.
+You may customize the renderer by overriding the model.
 
 ```ruby
-# config/initializers/avo.rb
-
-module Avo
-  module Fields
-    class MarkdownField < BaseField
-      def self.parser
-      # update this to your liking
-        renderer = ::Redcarpet::Render::HTML.new(hard_wrap: true)
-        ::Redcarpet::Markdown.new(renderer, lax_spacing: true, fenced_code_blocks: true, hard_wrap: true)
-      end
+# app/models/marksmith/renderer.rb
+
+require "redcarpet"
+
+module Marksmith
+  class Renderer
+    def renderer
+      ::Redcarpet::Markdown.new(
+        ::Redcarpet::Render::HTML,
+        tables: true,
+        lax_spacing: true,
+        fenced_code_blocks: true,
+        space_after_headers: true,
+        hard_wrap: true,
+        autolink: true,
+        strikethrough: true,
+        underline: true,
+        highlight: true,
+        quote: true,
+        with_toc_data: true
+      )
     end
   end
 end
 ```
-
-### In the controller
-
-```ruby
-module Avo
-  class MarkdownPreviewsController < ApplicationController
-    def create
-      # fetch the resource to get some information off of it
-      resource_class = Avo.resource_manager.get_resource_by_name(params[:resource_class])
-      # initialize it
-      resource = resource_class.new view: :edit
-      # run field detection
-      resource.detect_fields
-      # fetch the field
-      field = resource.get_field(params[:field_id])
-      # render the result
-      @result = field.parser.render(params[:body])
-    end
-  end
-end
-```
-
-### In the `ShowFieldComponent`
-
-```ruby
-# app/components/avo/fields/markdown_field/show_component.rb
-
-class Avo::Fields::MarkdownField::ShowComponent < Avo::Fields::ShowComponent
-  def parsed_body
-    renderer = Redcarpet::Render::HTML.new(hard_wrap: true)
-    parser = Redcarpet::Markdown.new(renderer, lax_spacing: true, fenced_code_blocks: true, hard_wrap: true)
-    parser.render(@field.value)
-  end
-end
-```

docs/3.0/fields/rhino.md

@@ -0,0 +1,20 @@
+---
+version: '3.17.0'
+license: community
+---
+
+# Rhino
+
+The wonderful [Rhino Editor](https://rhino-editor.vercel.app/) built by [Konnor Rogers](https://www.konnorrogers.com/) is available and fully integrated with Avo.
+
+```ruby
+field :body, as: :rhino
+```
+
+Rhino is based on [TipTap](https://tiptap.dev/) which is a powerful and flexible editor.
+
+The Rhino field supports [ActiveStorage](https://guides.rubyonrails.org/active_storage_overview.html) file attachments and seamlessly integrates with the [Media Library](./media-library).
+
+## Options
+
+<!-- @include: ./../common/field_options/always_show.md-->

docs/3.0/fields/tip_tap.md

@@ -1,8 +1,11 @@
 ---
-version: '3.5.0'
-license: community
+betaStatus: Deprecated
 ---
 
-# TipTap
+# Tip Tap
 
-WIP
+The `TipTap` field is deprecated in favor of the [Rhino](./rhino) field.
+
+The Rhino field is a fork of the TipTap editor with some additional features and improvements.
+
+The Rhino field is fully integrated with Avo and provides a seamless experience for managing rich text content using the [ActiveStorage](https://guides.rubyonrails.org/active_storage_overview.html) integration and the [Media Library](./media-library).

docs/3.0/fields/trix.md

@@ -12,18 +12,15 @@ field :body, as: :trix
 
 The `Trix` field renders a [WYSIWYG Editor](https://trix-editor.org/) and can be associated with a `string` or `text` column in the database. The value stored in the database will be the editor's resulting `HTML` content.
 
+It supports [ActiveStorage](https://guides.rubyonrails.org/active_storage_overview.html) file attachments and seamlessly integrates with the [Media Library](./media-library).
+
 <Image src="/assets/img/fields/trix.jpg" width="877" height="193" alt="Trix field" />
 
 Trix field is hidden from the `Index` view.
 
 ## Options
 
-<Option name="`always_show`">
-
-By default, the content of the `Trix` field is not visible on the `Show` view; instead, it's hidden under a `Show Content` link that, when clicked, displays the content. You can set Markdown to display the content by setting `always_show` to `true`.
-
-<!-- @include: ./../common/default_boolean_false.md-->
-</Option>
+<!-- @include: ./../common/field_options/always_show.md-->
 
 <Option name="`attachments_disabled`">
 

docs/3.0/media-library.md

@@ -0,0 +1,88 @@
+---
+version: "3.17.0"
+betaStatus: Alpha
+---
+
+# Media Library
+
+If you run an asset-intensive, having a place to view all those asses would be great. It's becoming easier with Avo and it's Media Library feature.
+
+The Media Library has two goals in mind.
+
+1. Browse and manage all your assets
+2. Use it to inject assets in all three of Avo's rich text editors ([trix]('./fields/trix'), [rhino]('./fields/rhino'), and [markdown]('./fields/markdown')).
+
+:::warning
+The Media Library feature is still in alpha and future releases might contain breaking changes so keep an eye out for the upgrade guide.
+
+This is just the initial version and we'll be adding more features as we progress and get more feedback on usage.
+:::
+
+## How to enable it
+
+The Media Library feature is disabled by default (until we release the stable version). To enable it, you need to do the following:
+
+```ruby{4}
+# config/initializers/avo.rb
+if defined?(Avo::MediaLibrary)
+  Avo::MediaLibrary.configure do |config|
+    config.enabled = true
+  end
+end
+```
+
+This is the killswitch of the whole feature.
+When disabled, the Media Library will not be available to anyone. It will hide the menu item, block the all the routes, and hide media the library icons from the editors.
+
+## Hide menu item
+
+You can hide the menu item from the sidebar by setting the `visible` option to `false`.
+
+```ruby
+# config/initializers/avo.rb
+if defined?(Avo::MediaLibrary)
+  Avo::MediaLibrary.configure do |config|
+    config.visible = false
+  end
+end
+```
+
+You may also use a [block](./execution-context) to conditionally show the menu item. You'll have access to the `Avo::Current` object and you can use it to show the menu item based on the current user.
+
+```ruby
+# config/initializers/avo.rb
+if defined?(Avo::MediaLibrary)
+  Avo::MediaLibrary.configure do |config|
+    config.visible = -> { Avo::Current.user.is_developer? }
+  end
+end
+```
+
+This will hide the menu item from the sidebar if the current user is not a developer.
+
+## Add it to the menu editor
+
+The Media Library is a menu item in the sidebar. You can add it to the menu editor by using the `media_library` helper.
+
+```ruby
+# config/initializers/avo.rb
+Avo.configure do |config|
+  config.main_menu = lambda {
+    link_to 'Media Library', avo.media_library_index_path
+  }
+end
+```
+
+## Use it with the rich text editors
+
+The Media Library will seamlessly integrate with all the rich text editors.
+
+```ruby
+field :body, as: :trix
+field :body, as: :rhino
+field :body, as: :markdown
+```
+
+The editors will each have a button to open the Media Library modal.
+Once open, after the user selects the asset, it will be injected into the editor.
+