dbdoc_engine 0.1.0

data/app/views/dbdoc_engine/admin/db_design_table_groups/deleted_groups.html.erb

@@ -0,0 +1,60 @@
+<!-- Custom Styled Breadcrumbs -->
+  <div class='d-flex align-items-center mb-3 breadcrumb-container mt-4 ms-5'>
+    <a href='<%= dbdoc_engine.root_path %>' class='text-decoration-none text-muted'>
+      <small><i class='bi bi-house-door'></i></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href="<%= dbdoc_engine.admin_dashboard_path(locale: I18n.locale) %>" class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.dashboardbread') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href='<%= dbdoc_engine.admin_db_design_dynamic_tables_path %>' class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.dynamic_tables_header') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <small><span class='text-custom-primary fw-medium'><%= t('dbdoc.deleted_table_groups') %></span></small>
+  </div>
+<div class='container-fluid mt-4 ps-5 pe-5'>
+  <!-- Page Heading -->
+  <div class='mb-4'>
+    <h4 class='fw-bold mb-0 text-custom-primary mb-4'>
+      <%= t('dbdoc.deleted_table_groups_h') %>
+    </h4>
+    <!-- Responsive search and action buttons row -->
+    <div class='row mb-3'>
+      <!-- Search Form -->
+      <div class='col-lg-8 col-md-7 col-sm-12 mb-2 mb-md-0'>
+        <%= form_with url: deleted_groups_admin_db_design_table_groups_path,
+                      method: :get,
+                      data: { turbo_frame: 'deleted_table_groups_results', controller: 'auto-submit' } do |f| %>
+          <%= f.hidden_field :locale, value: I18n.locale %>
+          <div class='input-group shadow-sm'>
+            <span class='input-group-text bg-white border-end-0'>
+              <i class='bi bi-search text-muted'></i>
+            </span>
+            <%= f.text_field :search,
+                            value: params[:search],
+                            class: 'form-control border-start-0',
+                            placeholder: t('dbdoc.search_by_group_name'),
+                            'aria-label': 'Search deleted groups',
+                            data: { action: 'input->auto-submit#submit' } %>
+            <% if params[:search].present? %>
+              <%= link_to dbdoc_engine.deleted_groups_admin_db_design_table_groups_path, class: 'btn btn-outline-secondary' do %>
+                <small><i class='bi bi-x-circle'></i> Clear</small>
+              <% end %>
+            <% end %>
+          </div>
+        <% end %>
+      </div>
+      <!-- Action Button -->
+      <div class='col-lg-4 col-md-5 col-sm-12 d-flex justify-content-md-end justify-content-sm-start mt-2 mt-md-0'>
+        <%= link_to dbdoc_engine.admin_db_design_table_groups_path,
+                    class: 'btn btn-outline-primary shadow-sm d-flex align-items-center' do %>
+          <small><i class='bi bi-eye-fill me-2'></i><span class="d-none d-sm-inline"><%= t('dbdoc.show_active') %></span></small>
+        <% end %>
+      </div>
+    </div>
+  </div>
+  <!-- Render Partial for Deleted Table Groups -->
+  <%= render 'deleted_table_groups_list', table_groups: @table_groups %>
+</div>

data/app/views/dbdoc_engine/admin/db_design_table_groups/edit.html.erb

@@ -0,0 +1,25 @@
+<%# Table Groups - Edit Page. This view provides the UI for editing an existing table group %>
+<%# Page heading with icon %>
+<!-- Custom Styled Breadcrumbs -->
+  <div class='d-flex align-items-center mb-3 breadcrumb-container mt-4 ms-5'>
+    <a href='<%= dbdoc_engine.root_path %>' class='text-decoration-none text-muted'>
+      <small><i class='bi bi-house-door'></i></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href="<%= dbdoc_engine.admin_dashboard_path(locale: I18n.locale) %>" class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.dashboardbread') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href='<%= dbdoc_engine.admin_db_design_table_groups_path %>' class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.tablegroups') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <small><span class='text-custom-primary fw-medium'><%= t('dbdoc.editgroup') %></span></small>
+  </div>
+<div class='d-flex justify-content-between align-items-center mb-4 ms-4'>
+  <h4 class='fw-bold mt-3 ms-4 mb-2 text-custom-primary'>
+    <i class='bi bi-pencil-square me-1 text-custom-primary'></i><%= t('dbdoc.edit_table_group_bold') %>
+  </h4>
+</div>
+<%# Render the form partial with the table group instance %>
+<%= render 'form', table_group: @table_group %>

data/app/views/dbdoc_engine/admin/db_design_table_groups/index.html.erb

@@ -0,0 +1,85 @@
+<div class='container-fluid mt-4 ps-5 pe-5'>
+  <!-- Custom Styled Breadcrumbs -->
+  <div class='d-flex align-items-center mb-3 breadcrumb-container'>
+    <nav aria-label="breadcrumb">
+  <ol class="breadcrumb mb-3 breadcrumb-container align-items-center">
+    <li class="breadcrumb-item p-0 m-0">
+      <a href="<%= dbdoc_engine.root_path %>" class="text-decoration-none text-muted">
+        <small><i class="bi bi-house-door pe-2"></i></small>
+      </a>
+    </li>
+    <li class="breadcrumb-item p-0 m-0">
+      <a href="<%= dbdoc_engine.admin_dashboard_path(locale: I18n.locale) %>" class="text-decoration-none text-muted pe-2">
+        <small><%= t('dbdoc.dashboardbread') %></small>
+      </a>
+    </li>
+    <li class="breadcrumb-item active p-0 m-0" aria-current="page">
+      <span class="text-custom-primary fw-medium"><small><%= t('dbdoc.tablegroups') %></small></span>
+    </li>
+  </ol>
+</nav>
+  </div>
+  <!-- Page Heading -->
+  <div class='mb-4'>
+    <h4 class='fw-bold mb-3 text-custom-primary mb-4'>
+      <%= t('dbdoc.table_groups') %>
+    </h4>
+
+    <!-- Search and Action Buttons -->
+    <div class='row mb-3'>
+      <!-- Search Form -->
+      <div class='col-lg-8 col-md-7 col-sm-12 mb-2 mb-md-0'>
+        <%= form_with url: admin_db_design_table_groups_path, method: :get, data: { turbo_frame: 'table_groups_results', controller: 'auto-submit' } do |f| %>
+          <%= f.hidden_field :locale, value: I18n.locale %>
+          <div class='input-group shadow-sm'>
+            <span class='input-group-text bg-white border-end-0'>
+              <small><i class='bi bi-search text-muted'></i></small>
+            </span>
+            <%= f.text_field :search, value: @search_query, class: 'form-control border-start-0',
+                placeholder: t('dbdoc.search_by_group_name'),
+                'aria-label': 'Search groups',
+                data: { action: 'input->auto-submit#submit' } %>
+            <% if @search_query.present? %>
+              <%= link_to dbdoc_engine.admin_db_design_table_groups_path, class: 'btn btn-outline-secondary' do %>
+                <small><i class='bi bi-x-circle'></i></small>
+              <% end %>
+            <% end %>
+          </div>
+        <% end %>
+      </div>
+
+      <!-- Action Buttons -->
+      <div class='col-lg-4 col-md-5 col-sm-12 d-flex justify-content-md-end justify-content-sm-start mt-2 mt-md-0'>
+        <div class='d-flex gap-2 flex-wrap'>
+          <% if can_delete? %>
+            <%= link_to dbdoc_engine.deleted_groups_admin_db_design_table_groups_path, class: 'btn btn-outline-danger shadow-sm d-flex align-items-center btn-sm' do %>
+              <small><i class='bi bi-trash me-1'></i><span class="d-none d-sm-inline"><%= t('dbdoc.view_deleted') %></span></small>
+            <% end %>
+          <% end %>
+
+          <% if can_edit? %>
+            <%= link_to dbdoc_engine.new_admin_db_design_table_group_path, class: 'btn btn-outline-success shadow-sm d-flex align-items-center btn-sm' do %>
+              <small><i class='bi bi-plus-circle-fill me-1'></i><span class="d-none d-sm-inline"><%= t('dbdoc.new') %></span></small>
+            <% end %>
+          <% end %>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- Table Card -->
+  <div class='card shadow mb-4'>
+    <div class='card-body p-0'>
+      <!-- Search Results Status -->
+      <% if @search_query.present? %>
+        <div class='alert alert-info mb-3'>
+          <div class='d-flex align-items-center'>
+            <small><i class='bi bi-info-circle me-2'></i>
+            <span>Found <%= @table_groups.count %> group<%= @table_groups.count != 1 ? 's' : '' %> matching '<%= @search_query %>'</span></small>
+          </div>
+        </div>
+      <% end %>
+      <!-- Render Partial -->
+      <%= render 'table_groups_list', table_groups: @table_groups, search_query: @search_query %>
+    </div>
+  </div>
+</div>

data/app/views/dbdoc_engine/admin/db_design_table_groups/new.html.erb

@@ -0,0 +1,26 @@
+<%# Table Groups - New Group Page. This view provides the UI for creating a new table group %>
+<% content_for :title, t('dbdoc.new_table_group') %>
+<!-- Custom Styled Breadcrumbs -->
+  <div class='d-flex align-items-center mb-3 breadcrumb-container mt-4 ms-5'>
+    <a href='<%= dbdoc_engine.root_path %>' class='text-decoration-none text-muted'>
+      <small><i class='bi bi-house-door'></i></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href="<%= dbdoc_engine.admin_dashboard_path(locale: I18n.locale) %>" class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.dashboardbread') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <a href='<%= dbdoc_engine.admin_db_design_table_groups_path %>' class='text-decoration-none text-muted'>
+      <small><%= t('dbdoc.tablegroups') %></small>
+    </a>
+    <span class='slash'> / </span>
+    <small><span class='text-custom-primary fw-medium'><%= t('dbdoc.newgroup') %></span></small>
+  </div>
+<%# Page heading with icon %>
+<div class="d-flex justify-content-between align-items-center mb-4 ms-4">
+  <h4 class="fw-bold mt-3 ms-4 mb-2 text-custom-primary">
+    <i class="bi bi-folder me-2 text-custom-primary"></i><%= t('dbdoc.new_table_group') %>
+  </h4>
+</div>
+<%# Render the form partial with the new table group instance %>
+<%= render 'form', table_group: @table_group %>

data/app/views/dbdoc_engine/db_doc_sessions/new.html.erb

@@ -0,0 +1,59 @@
+<div class='login-bg'>
+  <div class='login-card-container'>
+
+    <%# Left side: Illustration and tagline %>
+    <div class='login-left'>
+      <img src='<%= asset_path('dbdoc_engine/log_in_image.png') %>' alt='Login illustration' class='login-illustration' />
+      <div class='login-title'><%= t('dbdoc.login.title') %></div>
+      <div class='login-desc'>
+        <%= t('dbdoc.login.description_html').html_safe %>
+      </div>
+    </div>
+    
+    <!-- Right side: Login form -->
+    <div class='login-right'>
+      <!-- Button group: Back to main project + Language toggle -->
+      <div class="login-form-btn-row d-flex align-items-center" style="position: absolute; top: 18px; right: 24px; z-index: 10;">
+        <a href="/"
+           class="back-main-btn d-flex align-items-center justify-content-center fw-bold border-0 me-2"
+           title="<%= t('dbdoc.back_to_main_project') %>"
+           style="margin-right:10px;">
+          <%= t('dbdoc.back_to_main_project') %>
+        </a>
+        <%= render 'dbdoc_engine/shared/language_button' %>
+      </div>
+      
+      <div class='login-logo-row'>
+        <img src='/dbdoc_engine_assets/images/dblogo.svg' alt='DB DOCS Logo' class='login-logo' />
+        <span class='login-logo-text'><%= t('dbdoc.login.title') %></span>
+      </div>
+      
+      <%= form_with url: login_path, method: :post, class: 'login-form', 
+                    data: { controller: "login", action: "submit->login#validate" } do |f| %>
+        <div class='login-field'>
+          <%= f.label :username, t('dbdoc.login.username'), class: 'login-label' %>
+          <%= f.text_field :username, class: 'login-input', 
+                          data: { login_target: "username" }, 
+                          autocomplete: 'username' %>
+        </div>
+        
+        <div class='login-field'>
+          <%= f.label :password, t('dbdoc.login.password'), class: 'login-label' %>
+          <%= f.password_field :password, class: 'login-input', 
+                              data: { login_target: "password" }, 
+                              autocomplete: 'current-password' %>
+        </div>
+        
+        <div class='login-btn-row'>
+          <%= f.submit t('dbdoc.login.login_button'), class: 'login-btn' %>
+        </div>
+      <% end %>
+      
+      <!-- Hidden translations div -->
+      <div id="translations" style="display: none;" 
+           data-username-required="<%= t('dbdoc.login.errors.username_required') %>"
+           data-password-required="<%= t('dbdoc.login.errors.password_required') %>">
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/dbdoc_engine/home/changelog_details.html.erb

@@ -0,0 +1,80 @@
+<%# Changelog Details Page
+    Shows detailed information about a specific change record %>
+<div class='changelog-2-down py-4 pe-4'>
+  <!-- Back Button -->
+  <div class='mb-3'>
+    <%# Back to Change History link %>
+    <%= link_to dbdoc_engine.changelogs_path, class: 'btn back-history d-flex align-items-center' do %>
+      <i class='bi bi-arrow-left me-2'></i><%= t('dbdoc.back_to_change_history') %>
+    <% end %>
+  </div>
+  <!-- Change Details Card -->
+  <div class='card shadow-sm'>
+    <div class='card-header top'>
+      <h5 class='mb-0'><%= t('dbdoc.change_details') %></h5>
+    </div>
+    <div class='card-body'>
+      <%# Change metadata section %>
+      <div class='row mb-4'>
+        <%# Date and time information %>
+        <div class='col-md-6'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.date_and_time') %></p>
+          <p class='changelog-2'><%= @changelog.change_timestamp.strftime('%Y-%m-%d %H:%M:%S') %></p>
+        </div>
+        <%# Changed by information %>
+        <div class='col-md-6'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.changed_by') %></p>
+          <p class='changelog-2'><%= @changelog.changed_by %></p>
+        </div>
+        <%# Action type information %>
+        <div class='col-md-6'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.action') %></p>
+          <p class='changelog-2'><%= format_action_badge(@changelog.action_type) %></p>
+        </div>
+        <%# Entity type information %>
+        <div class='col-md-6'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.entity_type') %></p>
+          <p class='changelog-2'><%= format_entity_type(@changelog.entity_type) %></p>
+        </div>
+        <%# Entity name information %>
+        <div class='col-12'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.entity_name') %></p>
+          <p class='changelog-2'><%= @changelog.entity_name %></p>
+        </div>
+        <%# Change description %>
+        <div class='col-12'>
+          <p class='changelog-2-content mb-1'><%= t('dbdoc.description') %></p>
+          <div class='description_notes border rounded p-3 bg-light'>
+            <%= @changelog.description %>
+          </div>
+        </div>
+      </div>
+      <%# Value comparison section - only shows when values are available %>
+      <% if @changelog.previous_values.present? || @changelog.new_values.present? %>
+        <div class='pt-4'>
+          <h5 class='change-details mb-3'><%= t('dbdoc.change_details') %></h5>
+          <div class='row'>
+            <%# Previous values section %>
+            <% if @changelog.previous_values.present? %>
+              <div class='col-md-6'>
+                <h6 class='text-danger'><%= t('dbdoc.previous_values') %></h6>
+                <div class='border border-danger rounded p-3 bg-light'>
+                  <pre class='text-muted mb-0'><%= JSON.pretty_generate(@changelog.previous_values) %></pre>
+                </div>
+              </div>
+            <% end %>
+            <%# New values section %>
+            <% if @changelog.new_values.present? %>
+              <div class='col-md-6'>
+                <h6 class='text-success'><%= t('dbdoc.new_values') %></h6>
+                <div class='border border-success rounded p-3 bg-light'>
+                  <pre class='text-muted mb-0'><%= JSON.pretty_generate(@changelog.new_values) %></pre>
+                </div>
+              </div>
+            <% end %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</div>

data/app/views/dbdoc_engine/home/changelogs.html.erb

@@ -0,0 +1,20 @@
+<div class="changelog-contents py-4 pe-4">
+  <h1 class="changelogs h2 mb-4"><%= t('dbdoc.changelogs') %></h1>
+  <!-- Filter Form -->
+  <%= render 'dbdoc_engine/home/partials/filter_form', entity_type_options: entity_type_options, action_type_options: action_type_options %>
+  <!-- Changelog Table -->
+  <div class="card changelog-below">
+    <div class="table-responsive">
+      <table class="table">
+        <thead>
+          <%= render 'dbdoc_engine/home/partials/changelog_table_headers' %>
+        </thead>
+        <tbody>
+          <%= render 'dbdoc_engine/home/partials/changelog_rows', changelogs: @changelogs %>
+        </tbody>
+      </table>
+    </div>
+    <!-- Pagination Controls -->
+    <%= render 'dbdoc_engine/home/partials/pagination', collection: @changelogs %>
+  </div>
+</div>

data/app/views/dbdoc_engine/home/group_details.html.erb

@@ -0,0 +1,94 @@
+<%# Group details page showing tables within a specific table group %>
+<div class='group-details' data-controller='group-details'>
+  <div class='groupdetailsinner py-4 pe-4'>
+    <div class='shadow rounded-3 main-content-body'>
+      <%# Breadcrumb navigation %>
+      <div class='d-flex align-items-center mb-2'>
+      <nav aria-label="breadcrumb">
+  <ol class="breadcrumb mb-2 align-items-center" style="background: none; padding: 0; margin: 0;">
+    <!-- Tablegroups button -->
+    <li class="breadcrumb-item p-0 m-0">
+      <button
+        class="dbdocs-breadcrumb"
+        data-action="click->group-details#navigateToEcommerce"
+        type="button">
+        <%= t('dbdoc.tablegroups') %>
+      </button>
+    </li>
+    <!-- Group name as active breadcrumb -->
+    <li class="breadcrumb-item active dbdoc-breadcrumb p-0 m-0" aria-current="page">
+      <%= @group.group_name %>
+    </li>
+  </ol>
+</nav>
+      </div>
+      <%# Group section with colored left border %>
+      <div class='bg-white rounded-1 shadow-sm mb-4 group-section' style='border-left: 4px solid <%= @group.group_color %>;'>
+        <div class='d-flex align-items-center justify-content-between py-2 px-2 shadow-sm group-header' data-action='click->group-details#toggleGroupContentHeader'>
+          <div class='main-left'>
+            <div class='d-flex align-items-center me-3 group-header-left'>
+              <%# Table count badge with semi-transparent background of group color %>
+              <div class='badge d-inline-flex align-items-center justify-content-center rounded-circle ms-2 fw-bold group-count-badge'
+                   style='background-color: <%= hex_to_rgba(@group.group_color) %>; color: <%= @group.group_color %>;'>
+                <%= @tables_count %>
+              </div>
+            </div>
+            <span class='group-name'><%= @group.group_name %></span>
+          </div>
+          <%# Toggle button for group content visibility %>
+          <button class='border-0 rounded-pill fw-medium fs-7 py-1 px-4 view-button active'
+                  data-group-details-target='viewButton'
+                  data-action='click->group-details#toggleGroupContent'>
+            <%= t('dbdoc.view') %>
+          </button>
+        </div>
+        <%# Group content section initially active/visible %>
+        <div class='group-content active' data-group-details-target='groupContent'>
+          <div class='second-page-inner table-responsive'>
+            <table class='secondpagtable'>
+              <thead>
+                <tr class='second-page-header'>
+                  <th class='fw-bold group-content-names3 name-second'><%= t('dbdoc.name') %></th>
+                  <th class='fw-bold group-content-names3 physical-second'><%= t('dbdoc.physicalname') %></th>
+                  <th class='fw-bold group-content-names3 column-second'><%= t('dbdoc.columncount') %></th>
+                  <th class='group-content-notes fw-bold remarks-second'><%= t('dbdoc.remarks') %></th>
+                </tr>
+              </thead>
+              <tbody>
+                <% if @tables_count == 0 %>
+                  <tr>
+                    <td colspan='4' class='no-tables-message'>
+                      <%= t('dbdoc.no_tables_created_in_this_group_yet') %>
+                    </td>
+                  </tr>
+                <% else %>
+                  <% @group.db_design_dynamic_tables.each do |table| %>
+                    <tr class='group-table-row2'>
+                      <td class='group-table-names2'>
+                        <svg width='11' height='11' viewBox='0 0 11 11' xmlns='http://www.w3.org/2000/svg'>
+                          <rect width='11' height='11' fill='<%= @group.group_color %>'/>
+                        </svg>
+                        <a href='<%= dbdoc_engine.table_details_path(table.id) %>' class='table-link'>
+                          <%= table.table_name %>
+                        </a>
+                      </td>
+                      <td class='group-table-names2'>
+                        <%= table.physical_table_name || 'N/A' %>
+                      </td>
+                      <td class='group-table-names2'>
+                        <%= column_count(table) %>
+                      </td>
+                      <td class='group-table-notes2'>
+                        <%= table.description || 'No description available' %>
+                      </td>
+                    </tr>
+                  <% end %>
+                <% end %>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/dbdoc_engine/home/index.html.erb

@@ -0,0 +1,11 @@
+<div class='ecommerce-content' data-controller='ecommerce'>
+  <div class='ecommercewidth py-4 pe-4'>
+    <!-- Render Stats Container -->
+    <%= render 'dbdoc_engine/home/partials/stats_container' %>
+    <div class='shadow rounded-3 main-content-body'>
+      <h5 class='mb-4 fw-bold dbdocs'><%= t('dbdoc.tablegroups') %></h5>
+      <!-- Render Table Groups -->
+      <%= render 'dbdoc_engine/home/partials/table_groups' %>
+    </div>
+  </div>
+</div>

data/app/views/dbdoc_engine/home/partials/_action_badge.html.erb

@@ -0,0 +1,11 @@
+<% case action_type %>
+<% when 'create' %>
+  <!-- Display a green badge when the action type is 'create' -->
+  <span class='badge bg-success'><%= t('dbdoc.create') %></span>
+<% when 'update' %>
+  <!-- Display a yellow badge when the action type is 'update' -->
+  <span class='badge bg-warning text-dark'><%= t('dbdoc.update') %></span>
+<% when 'delete' %>
+  <!-- Display a red badge when the action type is 'delete' -->
+  <span class='badge bg-danger'><%= t('dbdoc.delete') %></span>
+<% end %>

data/app/views/dbdoc_engine/home/partials/_breadcrumb_navigation.html.erb

@@ -0,0 +1,30 @@
+<div class='d-flex align-items-center mb-2'>
+  <nav aria-label="breadcrumb">
+    <ol class="breadcrumb mb-2 align-items-center" style="background: none; padding: 0; margin: 0;">
+      <li class="breadcrumb-item p-0 m-0">
+        <button
+          class="dbdocs-breadcrumb"
+          data-action="click->table-details#navigateToEcommerce"
+          type="button">
+          <%= t('dbdoc.tablegroups') %>
+        </button>
+      </li>
+      <% if local_assigns.key?(:group) && group %>
+        <li class="breadcrumb-item p-0 m-0 fw-bold">
+          <button
+            class="dbdocs-breadcrumb"
+            data-action="click->table-details#navigateToGroup"
+            data-group-id="<%= group.id %>"
+            type="button">
+            <%= group.group_name %>
+          </button>
+        </li>
+      <% end %>
+      <% if local_assigns.key?(:table) && table %>
+        <li class="breadcrumb-item active dbdoc-breadcrumb p-0 m-0" aria-current="page">
+          <%= table.table_name %>
+        </li>
+      <% end %>
+    </ol>
+  </nav>
+</div>

data/app/views/dbdoc_engine/home/partials/_changelog_rows.html.erb

@@ -0,0 +1,35 @@
+<% if changelogs.any? %>
+  <!-- Check if there are any changelog records -->
+  <% changelogs.each do |log| %>
+    <!-- Iterate over each changelog entry -->
+    <tr>
+      <!-- Display the timestamp of the change, formatted as 'YYYY-MM-DD HH:MM:SS' -->
+      <td class='contents-changelog'><%= log.change_timestamp.strftime('%Y-%m-%d %H:%M:%S') %></td>
+
+      <td>
+        <!-- Render a partial to display an action badge based on the action type -->
+        <%= render 'dbdoc_engine/home/partials/action_badge', action_type: log.action_type %>
+      </td>
+
+      <!-- Display the entity type after formatting it using a helper method -->
+      <td class='contents-changelog'><%= format_entity_type(log.entity_type) %></td>
+
+      <!-- Display the name of the changed entity -->
+      <td class='contents-changelog'><%= log.entity_name %></td>
+
+      <!-- Display the change description with a max width of 250px and text truncation -->
+      <td class='contents-changelog text-truncate'><%= log.description %></td>
+
+      <!-- Display the name of the user who made the change -->
+      <td class='contents-changelog'><%= log.changed_by %></td>
+
+      <!-- Link to view more details about the specific changelog entry -->
+      <td><%= link_to t('dbdoc.view'), dbdoc_engine.changelog_details_path(log), class: 'view-changelog' %></td>
+    </tr>
+  <% end %>
+<% else %>
+  <!-- If no changelogs exist, display a message -->
+  <tr>
+    <td colspan='7' class='text-center text-muted'>No changes found matching your criteria.</td>
+  </tr>
+<% end %>

data/app/views/dbdoc_engine/home/partials/_changelog_table_headers.html.erb

@@ -0,0 +1,16 @@
+<tr>
+  <!-- Table header for the date and time of the change -->
+  <th class= 'text-secondary'><%= t('dbdoc.date_and_time') %></th>
+  <!-- Table header for the type of action performed (e.g., create, update, delete) -->
+  <th class= 'text-secondary'><%= t('dbdoc.action') %></th>
+  <!-- Table header for the entity type that was modified (e.g., table, column, user) -->
+  <th class= 'text-secondary'><%= t('dbdoc.entity_type') %></th>
+  <!-- Table header for the name of the specific entity that was changed -->
+  <th class= 'text-secondary'><%= t('dbdoc.entity_name') %></th>
+  <!-- Table header for a brief description of the change made -->
+  <th class= 'text-secondary'><%= t('dbdoc.description') %></th>
+  <!-- Table header for displaying the user who made the change -->
+  <th class= 'text-secondary'><%= t('dbdoc.changed_by') %></th>
+  <!-- Table header for a link to view detailed information about the change -->
+  <th class= 'text-secondary'><%= t('dbdoc.details') %></th>
+</tr>

data/app/views/dbdoc_engine/home/partials/_column_headers.html.erb

@@ -0,0 +1,23 @@
+<!-- Table header row for group content/column details -->
+<tr class='group-content-header'>
+  <!-- Logical name of the column/group -->
+  <th class='text-secondary third-header third-header-1' width= "13%"><%= t('dbdoc.name') %></th>
+  <!-- Physical name in the database -->
+  <th class='text-secondary third-header' width= "11%"><%= t('dbdoc.physicalname') %></th>
+  <!-- Data type (e.g., integer, varchar) -->
+  <th class='text-secondary third-header' width= "7%"><%= t('dbdoc.type') %></th>
+  <!-- Length/size of the field -->
+  <th class='text-secondary third-header' width="5%"><%= t('dbdoc.length') %></th>
+  <!-- Additional settings (e.g., NOT NULL, AUTO_INCREMENT) -->
+  <th class='text-secondary third-header' width="12%"><%= t('dbdoc.constraints') %></th>
+  <!-- Foreign key or reference information -->
+  <th class='text-secondary third-header' width="3%"><%= t('dbdoc.references') %></th>
+  <!-- Default value for the column -->
+  <th class='text-secondary third-header' width="8%"><%= t('dbdoc.defaultvalue') %></th>
+  <!-- Sample value for the column -->
+  <th class='text-secondary third-header' width="9%"><%= t('dbdoc.samplevalue') %></th>
+  <!-- Decimal Precision for the column -->
+  <th class='text-secondary third-header' width="9.5%"><%= t('dbdoc.decimalprecision') %></th>
+  <!-- Remarks or comments about the column -->
+  <th class='text-secondary third-header' width="30%"><%= t('dbdoc.remarks') %></th>
+</tr>