smart_templates_settings.ejs

<div id="smart-templates-settings">
  <h2>AI model settings</h2>
  <div class="smart-templates-model-settings">
    <% if(model_settings) { %>
      <%- model_settings %>
    <% } else { %>
      Loading model settings...
    <% } %>
  </div>
  <h2>Smart Templates folder</h2>
  <div class="setting-component"
    data-name="Templates Folder"
    data-setting="smart_templates.templates_folder"
    data-type="text"
  ></div>
  <h2>Configure variable prompts</h2>
  <div id="smart-templates-var-prompts">
    <% var_prompts.forEach((var_prompt, i) => { %>
      <% if(i === 0) { %>
        <h3>Active</h3>
      <% } else if(i > 0 && var_prompts[i-1].active !== var_prompt.active) { %>
        <h3>Inactive</h3>
      <% } %>
      <div class="setting-component"
        data-name="<%= var_prompt.name %>"
        data-type="textarea"
        data-setting="smart_templates.var_prompts.<%= var_prompt.name %>.prompt"
        data-max-length="300"
      ></div>
      <% // if !var_prompt.active, add a button to remove it %>
      <% if(!var_prompt.active) { %>
        <div class="setting-component"
          data-name="Remove"
          data-value="<%= var_prompt.name %>"
          data-type="button"
          data-callback="remove_var_prompt"
        ></div>
      <% } %>
    <% }) %>
  </div>
</div>
<hr>