add settings navbar

pull/105/head
Alex Turchyn 2 years ago
parent 1435d55727
commit 45adee6ddf

@ -6,6 +6,7 @@ import ToggleVisible from './elements/toggle_visible'
import DisableHidden from './elements/disable_hidden' import DisableHidden from './elements/disable_hidden'
import TurboModal from './elements/turbo_modal' import TurboModal from './elements/turbo_modal'
import FileDropzone from './elements/file_dropzone' import FileDropzone from './elements/file_dropzone'
import MenuActive from './elements/menu_active'
import FlowBuilder from './flow_builder/builder' import FlowBuilder from './flow_builder/builder'
@ -17,6 +18,7 @@ window.customElements.define('toggle-visible', ToggleVisible)
window.customElements.define('disable-hidden', DisableHidden) window.customElements.define('disable-hidden', DisableHidden)
window.customElements.define('turbo-modal', TurboModal) window.customElements.define('turbo-modal', TurboModal)
window.customElements.define('file-dropzone', FileDropzone) window.customElements.define('file-dropzone', FileDropzone)
window.customElements.define('menu-active', MenuActive)
window.customElements.define('flow-builder', class extends HTMLElement { window.customElements.define('flow-builder', class extends HTMLElement {
connectedCallback () { connectedCallback () {

@ -0,0 +1,9 @@
export default class extends HTMLElement {
connectedCallback () {
this.querySelectorAll('a').forEach((link) => {
if (document.location.pathname.startsWith(link.pathname)) {
link.classList.add('bg-base-300')
}
})
}
}

@ -1,27 +1,34 @@
Email settings <div class="max-w-6xl mx-auto">
<% value = @encrypted_config.value || {} %> <div class="flex space-x-8">
<%= form_for @encrypted_config, url: settings_email_index_path, method: :post, html: { autocomplete: 'off' } do |f| %> <%= render 'shared/settings_nav' %>
<%= f.fields_for :value do |ff| %> <div class="mt-4">
<div> Email settings
<%= ff.label :host %> <% value = @encrypted_config.value || {} %>
<%= ff.text_field :host, value: value['host'], required: true %> <%= form_for @encrypted_config, url: settings_email_index_path, method: :post, html: { autocomplete: 'off' } do |f| %>
<%= f.fields_for :value do |ff| %>
<div>
<%= ff.label :host %>
<%= ff.text_field :host, value: value['host'], required: true %>
</div>
<div>
<%= ff.label :port %>
<%= ff.text_field :port, value: value['port'], required: true %>
</div>
<div>
<%= ff.label :username %>
<%= ff.text_field :username, value: value['username'], required: true %>
</div>
<div>
<%= ff.label :password %>
<%= ff.password_field :password, value: value['password'], required: true %>
</div>
<div>
<%= ff.label :from_email, 'Send from' %>
<%= ff.email_field :from_email, value: value['from_email'], required: true %>
</div>
<% end %>
<%= f.button button_title %>
<% end %>
</div> </div>
<div> </div>
<%= ff.label :port %> </div>
<%= ff.text_field :port, value: value['port'], required: true %>
</div>
<div>
<%= ff.label :username %>
<%= ff.text_field :username, value: value['username'], required: true %>
</div>
<div>
<%= ff.label :password %>
<%= ff.password_field :password, value: value['password'], required: true %>
</div>
<div>
<%= ff.label :from_email, 'Send from' %>
<%= ff.email_field :from_email, value: value['from_email'], required: true %>
</div>
<% end %>
<%= f.button button_title %>
<% end %>

@ -1,10 +1,17 @@
<%= form_for '', url: settings_esign_index_path, method: :post do |f| %> <div class="max-w-6xl mx-auto">
<file-dropzone data-name="verify_attachments"> <div class="flex space-x-8">
<label for="file"> <%= render 'shared/settings_nav' %>
<input id="attachment_uuid" name="attachment_uuid" class="hidden" data-target="file-dropzone.valueField" type="text"> <div class="mt-4">
<input id="file" class="hidden" data-action="change:file-dropzone#onSelectFiles" data-target="file-dropzone.input" type="file"> <%= form_for '', url: settings_esign_index_path, method: :post do |f| %>
LCick to upload <file-dropzone data-name="verify_attachments">
</label> <label for="file">
</file-dropzone> <input id="attachment_uuid" name="attachment_uuid" class="hidden" data-target="file-dropzone.valueField" type="text">
<%= f.button button_title %> <input id="file" class="hidden" data-action="change:file-dropzone#onSelectFiles" data-target="file-dropzone.input" type="file">
<% end %> LCick to upload
</label>
</file-dropzone>
<%= f.button button_title %>
<% end %>
</div>
</div>
</div>

@ -0,0 +1,33 @@
<menu-active class="block">
<div class="mt-4 -ml-3.5">
<ul class="menu menu-compact px-2 w-52">
<li class="menu-title"><span>Settings</span></li>
<li></li>
<li>
<a href="<%= settings_profile_index_path %>" class="hover:bg-base-300">
Profile
</a>
</li>
<li>
<a href="<%= settings_email_index_path %>" class="hover:bg-base-300">
Email
</a>
</li>
<li>
<a href="<%= settings_storage_index_path %>" class="hover:bg-base-300">
Storage
</a>
</li>
<li>
<a href="<%= settings_esign_index_path %>" class="hover:bg-base-300">
eSign
</a>
</li>
<li>
<a href="<%= settings_users_path %>" class="hover:bg-base-300">
Team
</a>
</li>
</ul>
</div>
</menu-active>

@ -1,67 +1,74 @@
Storage settings <div class="max-w-6xl mx-auto">
<% value = @encrypted_config.value || { 'service' => 'disk' } %> <div class="flex space-x-8">
<% configs = value['configs'] || {} %> <%= render 'shared/settings_nav' %>
<%= form_for @encrypted_config, url: settings_storage_index_path, method: :post, html: { autocomplete: 'off' } do |f| %> <div class="mt-4">
<% options = [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google']] %> Storage settings
<toggle-visible data-element-ids="<%= options.map(&:last).to_json %>"> <% value = @encrypted_config.value || { 'service' => 'disk' } %>
<% [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google']].each do |(label, val)| %> <% configs = value['configs'] || {} %>
<%= f.radio_button :selected, val, checked: value['service'] == val, data: { action: 'change:toggle-visible#trigger' } %> <%= form_for @encrypted_config, url: settings_storage_index_path, method: :post, html: { autocomplete: 'off' } do |f| %>
<%= f.label :selected, label, value: val %> <% options = [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google']] %>
<% end %> <toggle-visible data-element-ids="<%= options.map(&:last).to_json %>">
</toggle-visible> <% [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google']].each do |(label, val)| %>
<disable-hidden id="disk" class="<%= 'hidden' if value['service'] != 'disk' %>"> <%= f.radio_button :selected, val, checked: value['service'] == val, data: { action: 'change:toggle-visible#trigger' } %>
<%= f.fields_for :value do |ff| %> <%= f.label :selected, label, value: val %>
<%= ff.hidden_field :service, value: 'disk' %> <% end %>
<% end %> </toggle-visible>
<div> <disable-hidden id="disk" class="<%= 'hidden' if value['service'] != 'disk' %>">
Disk storage - no configs needed but make sure you have a persistant disk (heroku doesnt not have one) <%= f.fields_for :value do |ff| %>
</div> <%= ff.hidden_field :service, value: 'disk' %>
</disable-hidden> <% end %>
<disable-hidden id="aws_s3" class="<%= 'hidden' if value['service'] != 'aws_s3' %>"> <div>
<%= f.fields_for :value do |ff| %> Disk storage - no configs needed but make sure you have a persistant disk (heroku doesnt not have one)
<%= ff.hidden_field :service, value: 'aws_s3' %> </div>
<%= ff.fields_for :configs, configs do |fff| %> </disable-hidden>
<div> <disable-hidden id="aws_s3" class="<%= 'hidden' if value['service'] != 'aws_s3' %>">
<%= fff.label :access_key_id, 'Access key ID' %> <%= f.fields_for :value do |ff| %>
<%= fff.text_field :access_key_id, value: configs['access_key_id'], required: true %> <%= ff.hidden_field :service, value: 'aws_s3' %>
</div> <%= ff.fields_for :configs, configs do |fff| %>
<div> <div>
<%= fff.label :secret_access_key %> <%= fff.label :access_key_id, 'Access key ID' %>
<%= fff.password_field :secret_access_key, value: configs['secret_access_key'], required: true %> <%= fff.text_field :access_key_id, value: configs['access_key_id'], required: true %>
</div> </div>
<div> <div>
<%= fff.label :region %> <%= fff.label :secret_access_key %>
<%= fff.text_field :region, value: configs['region'], required: true %> <%= fff.password_field :secret_access_key, value: configs['secret_access_key'], required: true %>
</div> </div>
<div> <div>
<%= fff.label :bucket %> <%= fff.label :region %>
<%= fff.text_field :bucket, value: value['service'] == 'aws_s3' ? configs['bucket'] : '', required: true %> <%= fff.text_field :region, value: configs['region'], required: true %>
</div> </div>
<div> <div>
<%= fff.label :endpoint %> <%= fff.label :bucket %>
<%= fff.text_field :endpoint, value: configs['endpoint'], type: :url %> <%= fff.text_field :bucket, value: value['service'] == 'aws_s3' ? configs['bucket'] : '', required: true %>
</div> </div>
<% end %> <div>
<% end %> <%= fff.label :endpoint %>
</disable-hidden> <%= fff.text_field :endpoint, value: configs['endpoint'], type: :url %>
<disable-hidden id="google" class="<%= 'hidden' if value['service'] != 'google' %>"> </div>
<%= f.fields_for :value do |ff| %> <% end %>
<%= ff.hidden_field :service, value: 'google' %> <% end %>
<%= ff.fields_for :configs, configs do |fff| %> </disable-hidden>
<div> <disable-hidden id="google" class="<%= 'hidden' if value['service'] != 'google' %>">
<%= fff.label :project, 'Project' %> <%= f.fields_for :value do |ff| %>
<%= fff.text_field :project, value: configs['project'], required: true %> <%= ff.hidden_field :service, value: 'google' %>
</div> <%= ff.fields_for :configs, configs do |fff| %>
<div> <div>
<%= fff.label :bucket %> <%= fff.label :project, 'Project' %>
<%= fff.text_field :bucket, value: value['service'] == 'google' ? configs['bucket'] : '', required: true %> <%= fff.text_field :project, value: configs['project'], required: true %>
</div> </div>
<div> <div>
<%= fff.label :credentials, 'Credentials (JSON key content)' %> <%= fff.label :bucket %>
<%= fff.text_area :credentials, value: configs['credentials'], required: true %> <%= fff.text_field :bucket, value: value['service'] == 'google' ? configs['bucket'] : '', required: true %>
</div> </div>
<div>
<%= fff.label :credentials, 'Credentials (JSON key content)' %>
<%= fff.text_area :credentials, value: configs['credentials'], required: true %>
</div>
<% end %>
<% end %>
</disable-hidden>
<%= f.button button_title %>
<% end %> <% end %>
<% end %> </div>
</disable-hidden> </div>
<%= f.button button_title %> </div>
<% end %>

@ -1,37 +1,44 @@
<div> <div class="max-w-6xl mx-auto">
Users <div class="flex space-x-8">
<a href="<%= new_user_path %>" data-turbo-frame="modal">New User</a> <%= render 'shared/settings_nav' %>
<div class="mt-4">
<div>
Users
<a href="<%= new_user_path %>" data-turbo-frame="modal">New User</a>
</div>
<table>
<tr>
<th>
User
</th>
<th>
Role
</th>
<th>
Last session
</th>
<th>
</th>
</tr>
<% @users.each do |user| %>
<tr>
<td>
<%= user.full_name %><br>
<%= user.email %>
</td>
<td>
<%= user.role %>
</td>
<td>
<%= user.last_sign_in_at ? l(user.last_sign_in_at) : '-' %>
</td>
<td>
<%= link_to 'Edit', edit_user_path(user), data: { turbo_frame: 'modal' } %>
<%= button_to 'Remove', user_path(user), method: :delete, data: { turbo_confirm: 'Are you sure?' } %>
</td>
</tr>
<% end %>
</table>
</div>
</div>
</div> </div>
<table>
<tr>
<th>
User
</th>
<th>
Role
</th>
<th>
Last session
</th>
<th>
</th>
</tr>
<% @users.each do |user| %>
<tr>
<td>
<%= user.full_name %><br>
<%= user.email %>
</td>
<td>
<%= user.role %>
</td>
<td>
<%= user.last_sign_in_at ? l(user.last_sign_in_at) : '-' %>
</td>
<td>
<%= link_to 'Edit', edit_user_path(user), data: { turbo_frame: 'modal' } %>
<%= button_to 'Remove', user_path(user), method: :delete, data: { turbo_confirm: 'Are you sure?' } %>
</td>
</tr>
<% end %>
</table>

@ -55,6 +55,7 @@ Rails.application.routes.draw do
resources :storage, only: %i[index create], controller: 'storage_settings' resources :storage, only: %i[index create], controller: 'storage_settings'
resources :email, only: %i[index create], controller: 'email_settings' resources :email, only: %i[index create], controller: 'email_settings'
resources :esign, only: %i[index create], controller: 'esign_settings' resources :esign, only: %i[index create], controller: 'esign_settings'
resources :profile, only: %i[index create]
resources :users, only: %i[index] resources :users, only: %i[index]
end end
end end

@ -3,6 +3,13 @@ module.exports = {
require('daisyui') require('daisyui')
], ],
daisyui: { daisyui: {
themes: ['cupcake'] themes: [
{
cupcake: {
...require('daisyui/src/colors/themes')['[data-theme=cupcake]'],
primary: '#E4E0E1'
}
}
]
} }
} }

Loading…
Cancel
Save