diff --git a/src/autometabuilder/web/templates/components/atoms.html b/src/autometabuilder/web/templates/components/atoms.html deleted file mode 100644 index 7942ddf..0000000 --- a/src/autometabuilder/web/templates/components/atoms.html +++ /dev/null @@ -1,23 +0,0 @@ -{# Atomic UI primitives for Jinja2 templates. #} -{% macro icon(name, extra_class='') -%} - -{%- endmacro %} - -{% macro section_header(title, subtitle='') -%} -
-

{{ title }}

- {% if subtitle %} -

{{ subtitle }}

- {% endif %} -
-{%- endmacro %} - -{% macro helper_text(text) -%} -{% if text %} -

{{ text }}

-{% endif %} -{%- endmacro %} - -{% macro pill(text, tone='neutral') -%} -{{ text }} -{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/atoms/helper_text.html b/src/autometabuilder/web/templates/components/atoms/helper_text.html new file mode 100644 index 0000000..9dd126c --- /dev/null +++ b/src/autometabuilder/web/templates/components/atoms/helper_text.html @@ -0,0 +1,6 @@ +{# Helper text for form fields. #} +{% macro helper_text(text) -%} +{% if text %} +

{{ text }}

+{% endif %} +{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/atoms/icon.html b/src/autometabuilder/web/templates/components/atoms/icon.html new file mode 100644 index 0000000..2a7e4ad --- /dev/null +++ b/src/autometabuilder/web/templates/components/atoms/icon.html @@ -0,0 +1,4 @@ +{# Atomic UI primitive for Jinja2 templates. #} +{% macro icon(name, extra_class='') -%} + +{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/atoms/pill.html b/src/autometabuilder/web/templates/components/atoms/pill.html new file mode 100644 index 0000000..a921916 --- /dev/null +++ b/src/autometabuilder/web/templates/components/atoms/pill.html @@ -0,0 +1,4 @@ +{# Pill label. #} +{% macro pill(text, tone='neutral') -%} +{{ text }} +{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/atoms/section_header.html b/src/autometabuilder/web/templates/components/atoms/section_header.html new file mode 100644 index 0000000..60b81a1 --- /dev/null +++ b/src/autometabuilder/web/templates/components/atoms/section_header.html @@ -0,0 +1,9 @@ +{# Section header macro. #} +{% macro section_header(title, subtitle='') -%} +
+

{{ title }}

+ {% if subtitle %} +

{{ subtitle }}

+ {% endif %} +
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/molecules.html b/src/autometabuilder/web/templates/components/molecules/card.html similarity index 56% rename from src/autometabuilder/web/templates/components/molecules.html rename to src/autometabuilder/web/templates/components/molecules/card.html index dbb3d21..1d2f1d4 100644 --- a/src/autometabuilder/web/templates/components/molecules.html +++ b/src/autometabuilder/web/templates/components/molecules/card.html @@ -1,5 +1,5 @@ -{# Molecular UI components composed from atoms. #} -{% from "components/atoms.html" import icon %} +{# Card component. #} +{% from "components/atoms/icon.html" import icon %} {% macro card(title, icon_name=None, actions_html='') -%}
@@ -17,11 +17,3 @@
{%- endmacro %} - -{% macro empty_state(icon_name, title, body) -%} -
- {{ icon(icon_name, 'amb-empty-icon') }} -
{{ title }}
-

{{ body }}

-
-{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/molecules/empty_state.html b/src/autometabuilder/web/templates/components/molecules/empty_state.html new file mode 100644 index 0000000..4d69d3d --- /dev/null +++ b/src/autometabuilder/web/templates/components/molecules/empty_state.html @@ -0,0 +1,10 @@ +{# Empty state component. #} +{% from "components/atoms/icon.html" import icon %} + +{% macro empty_state(icon_name, title, body) -%} +
+ {{ icon(icon_name, 'amb-empty-icon') }} +
{{ title }}
+

{{ body }}

+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/organisms.html b/src/autometabuilder/web/templates/components/organisms/callout.html similarity index 77% rename from src/autometabuilder/web/templates/components/organisms.html rename to src/autometabuilder/web/templates/components/organisms/callout.html index 7b23890..ccfae0e 100644 --- a/src/autometabuilder/web/templates/components/organisms.html +++ b/src/autometabuilder/web/templates/components/organisms/callout.html @@ -1,5 +1,5 @@ -{# Organisms combine molecules into larger UI blocks. #} -{% from "components/atoms.html" import icon %} +{# Callout component. #} +{% from "components/atoms/icon.html" import icon %} {% macro callout(title, body, tone='info', icon_name='info-circle') -%}
diff --git a/src/autometabuilder/web/templates/components/sections.html b/src/autometabuilder/web/templates/components/sections.html deleted file mode 100644 index 78cb936..0000000 --- a/src/autometabuilder/web/templates/components/sections.html +++ /dev/null @@ -1,516 +0,0 @@ -{# Page section components composed from atoms, molecules, and organisms. #} -{% from "components/atoms.html" import section_header, helper_text, pill %} -{% from "components/molecules.html" import card, empty_state %} -{% from "components/organisms.html" import callout %} - -{% macro choice_card(id, value, icon_name, title, description, checked=False, extra_html='') -%} - -{%- endmacro %} - -{% macro prompt_chip(target_id, snippet, label) -%} - -{%- endmacro %} - -{% macro prompt_step(step_number, title, description, textarea_id, name, placeholder, value, rows=5, chips=[]) -%} -
-
- {{ step_number }} {{ title }} -
- {{ helper_text(description) }} - - {% if chips %} -
- {% for chip in chips %} - {{ prompt_chip(chip.target, chip.snippet, chip.label) }} - {% endfor %} -
- {% endif %} -
-{%- endmacro %} - -{% macro dashboard_section() -%} -
- {{ section_header(t('ui.dashboard.title', 'Dashboard'), t('ui.dashboard.subtitle', 'Control the bot and monitor system activity')) }} - -
-
-
-
-
{{ t('ui.dashboard.bot_control', 'Bot Control') }}
-
-
-
-
- -
- {% set iterations_extra %} - - {% endset %} - - {{ choice_card('mode-once', 'once', '1-circle', t('ui.dashboard.run.single.title', 'Single Iteration'), t('ui.dashboard.run.single.desc', 'One full pass through the workflow.'), True) }} - {{ choice_card('mode-iterations', 'iterations', 'arrow-repeat', t('ui.dashboard.run.repeat.title', 'Repeat'), t('ui.dashboard.run.repeat.desc', 'Run a fixed number of cycles.'), False, iterations_extra) }} - {{ choice_card('mode-yolo', 'yolo', 'infinity', t('ui.dashboard.run.yolo.title', 'YOLO'), t('ui.dashboard.run.yolo.desc', 'Keep iterating until you stop it.')) }} -
-
- -
- -
-
- - -
-
- - -
-
-
- - -
-
-
- -
-
-
{{ t('ui.dashboard.status.title', 'Status') }}
-
-
-
-
- {{ t('ui.dashboard.status.bot_label', 'Bot Status') }} -
- - {% if is_running %}{{ t('ui.dashboard.status.running', 'Running') }}{% else %}{{ t('ui.dashboard.status.idle', 'Idle') }}{% endif %} -
-
-
- {{ t('ui.dashboard.status.mvp_label', 'MVP Milestone') }} - - {% if mvp_reached %} - {{ t('ui.dashboard.status.mvp_reached', 'Reached') }} - {% else %} - {{ t('ui.dashboard.status.mvp_progress', 'In Progress') }} - {% endif %} - -
-
-
-
-
-
-
-
- -
-
-
-
{{ t('ui.dashboard.logs.title', 'Recent Logs') }}
- -
-
- 
{{ logs }}
-
-
-
-
-
-{%- endmacro %} - -{% macro workflow_section() -%} -
- {{ section_header(t('ui.workflow.title', 'Workflow Builder'), t('ui.workflow.subtitle', "Design the bot's task execution pipeline")) }} - -
-
-
{{ t('ui.workflow.card.title', 'Tasks & Steps') }}
-
- -
-
-
-
- -
-
- -
- -
-
-
-
-
-{%- endmacro %} - -{% macro prompt_section() -%} -
- {{ section_header(t('ui.prompt.title', 'Prompt Builder'), t('ui.prompt.subtitle', 'Shape how the assistant thinks, speaks, and decides')) }} - -
-
- {% call card(t('ui.prompt.card.title', 'Prompt Builder'), "chat-square-text") %} -
- -
- {% set system_chips = [ - {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.senior.snippet', 'You are a senior software engineer focused on correctness and clarity.'), 'label': t('ui.prompt.chip.senior.label', 'Senior engineer')}, - {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.ask.snippet', 'Ask clarifying questions before making risky changes.'), 'label': t('ui.prompt.chip.ask.label', 'Ask questions')}, - {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.minimal.snippet', 'Prefer minimal diffs and explain trade-offs.'), 'label': t('ui.prompt.chip.minimal.label', 'Minimal diffs')} - ] %} - {{ prompt_step(1, - t('ui.prompt.step1.title', 'Define the assistant'), - t('ui.prompt.step1.desc', 'Describe who the assistant is and how it should behave.'), - 'system-prompt', - 'system_content', - t('ui.prompt.step1.placeholder', 'You are a senior software engineer who prefers small, safe changes.'), - (prompt_content | extract_system_content), - 6, - system_chips - ) }} - - {% set user_chips = [ - {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.ux.snippet', 'Focus on UX polish, and avoid major refactors.'), 'label': t('ui.prompt.chip.ux.label', 'UX polish')}, - {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.tests.snippet', 'Add tests when possible, but avoid heavy scaffolding.'), 'label': t('ui.prompt.chip.tests.label', 'Add tests')}, - {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.summarize.snippet', 'Summarize changes and suggest next steps.'), 'label': t('ui.prompt.chip.summarize.label', 'Summarize')} - ] %} - {{ prompt_step(2, - t('ui.prompt.step2.title', 'Give the mission'), - t('ui.prompt.step2.desc', 'Explain what the bot should accomplish right now.'), - 'user-prompt', - 'user_content', - t('ui.prompt.step2.placeholder', 'Review the repo, improve the UI, and summarize what changed.'), - (prompt_content | extract_user_content), - 5, - user_chips - ) }} - -
- - {{ helper_text(t('ui.prompt.model.desc', 'Pick the balance of quality and speed that fits the task.')) }} - -
-
- -
- - {{ helper_text(t('ui.prompt.raw.desc', 'Edit the full YAML only if you need fine control.')) }} - -
- -
- - -
-
- {% endcall %} -
- -
- {% call card(t('ui.prompt.guidance.title', 'Guidance'), "lightbulb") %} -
-
- {{ t('ui.prompt.guidance.keep_human.title', 'Keep it human') }} -

{{ t('ui.prompt.guidance.keep_human.desc', 'Write instructions the way you would brief a teammate.') }}

-
-
- {{ t('ui.prompt.guidance.be_specific.title', 'Be specific') }} -

{{ t('ui.prompt.guidance.be_specific.desc', 'Mention constraints like time, scope, or testing expectations.') }}

-
-
- {{ t('ui.prompt.guidance.raw.title', 'Use advanced YAML sparingly') }} -

{{ t('ui.prompt.guidance.raw.desc', 'Only switch to raw YAML if you need full control.') }}

-
-
- {% endcall %} -
-
-
-{%- endmacro %} - -{% macro settings_section() -%} -
- {{ section_header(t('ui.settings.title', 'Settings'), t('ui.settings.subtitle', 'Configure services, security, and environment preferences')) }} - - {{ callout(t('ui.settings.callout.title', 'Human-friendly settings'), t('ui.settings.callout.body', 'Each field explains what it does. Add descriptions in metadata.json to keep custom settings readable for everyone.'), "info", "info-circle") }} - -
-
- {% set settings_desc = metadata.get('settings_descriptions', {}) %} - -
-
-
-
{{ t('ui.settings.api_keys', 'API Keys') }}
-
-
- {% for key in ['GITHUB_TOKEN', 'OPENAI_API_KEY', 'LITELLM_API_KEY'] %} - {% set desc = settings_desc.get(key, {}) %} -
- -

{{ desc.get('description', '') }}

- -
- {% endfor %} -
-
-
- -
-
-
-
{{ t('ui.settings.configuration', 'Configuration') }}
-
-
- {% for key in ['GITHUB_REPOSITORY', 'LOG_LEVEL', 'APP_LANG', 'PROMPT_PATH'] %} - {% set desc = settings_desc.get(key, {}) %} -
- -

{{ desc.get('description', '') }}

- {% if desc.get('type') == 'select' %} - - {% else %} - - {% endif %} -
- {% endfor %} -
-
- -
-
-
{{ t('ui.settings.web_access', 'Web UI Access') }}
-
-
- {% for key in ['WEB_USER', 'WEB_PASSWORD'] %} - {% set desc = settings_desc.get(key, {}) %} -
- -

{{ desc.get('description', '') }}

- -
- {% endfor %} -
-
-
-
- -
-
-
{{ t('ui.settings.other', 'Other Settings') }}
-
-
-
- {% set known_keys = ['GITHUB_TOKEN', 'OPENAI_API_KEY', 'LITELLM_API_KEY', 'GITHUB_REPOSITORY', 'LOG_LEVEL', 'APP_LANG', 'PROMPT_PATH', 'WEB_USER', 'WEB_PASSWORD'] %} - {% for key, value in env_vars.items() %} - {% if key not in known_keys %} -
-
- {% set desc = settings_desc.get(key, {}) %} - -

- {{ desc.get('description', t('ui.settings.custom_default_desc', 'Custom environment setting. Add a description in metadata.json to show it here.')) }} -

- -
-
- {% endif %} - {% endfor %} -
-
- -

{{ t('ui.settings.add.desc', 'Use uppercase keys with underscores, like API_TIMEOUT.') }}

-
- - -
-
-
-
-
-
- -
-
-
-
-{%- endmacro %} - -{% macro translations_section() -%} -
- {{ section_header(t('ui.translations.title', 'Translations'), t('ui.translations.subtitle', 'Create, edit, and maintain language files for bot messages')) }} - -
-
-
-
-
{{ t('ui.translations.languages', 'Languages') }}
-
-
-
- {% for lang, file in translations.items() %} -
-
- -
- {{ lang.upper() }} - {{ file }} -
-
-
- - {% if lang != 'en' %} - - {% endif %} -
-
- {% endfor %} -
-
-
-
- - -
-
-
-
- -
-
-
-
{{ t('ui.translations.editor.title', 'Translation Editor') }}
- -
-
-
- {{ empty_state("translate", t('ui.translations.empty.title', 'Pick a language'), t('ui.translations.empty.body', 'Select a language from the list to start editing translations.')) }} -
- -
-
-
-
-
-{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/choice_card.html b/src/autometabuilder/web/templates/components/sections/choice_card.html new file mode 100644 index 0000000..026482c --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/choice_card.html @@ -0,0 +1,13 @@ +{# Choice card macro. #} +{% macro choice_card(id, value, icon_name, title, description, checked=False, extra_html='') -%} + +{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/dashboard_section.html b/src/autometabuilder/web/templates/components/sections/dashboard_section.html new file mode 100644 index 0000000..a282c5a --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/dashboard_section.html @@ -0,0 +1,107 @@ +{# Dashboard section macro. #} +{% from "components/atoms/section_header.html" import section_header %} +{% from "components/sections/choice_card.html" import choice_card %} + +{% macro dashboard_section() -%} +
+ {{ section_header(t('ui.dashboard.title', 'Dashboard'), t('ui.dashboard.subtitle', 'Control the bot and monitor system activity')) }} + +
+
+
+
+
{{ t('ui.dashboard.bot_control', 'Bot Control') }}
+
+
+
+
+ +
+ {% set iterations_extra %} + + {% endset %} + + {{ choice_card('mode-once', 'once', '1-circle', t('ui.dashboard.run.single.title', 'Single Iteration'), t('ui.dashboard.run.single.desc', 'One full pass through the workflow.'), True) }} + {{ choice_card('mode-iterations', 'iterations', 'arrow-repeat', t('ui.dashboard.run.repeat.title', 'Repeat'), t('ui.dashboard.run.repeat.desc', 'Run a fixed number of cycles.'), False, iterations_extra) }} + {{ choice_card('mode-yolo', 'yolo', 'infinity', t('ui.dashboard.run.yolo.title', 'YOLO'), t('ui.dashboard.run.yolo.desc', 'Keep iterating until you stop it.')) }} +
+
+ +
+ +
+
+ + +
+
+ + +
+
+
+ + +
+
+
+ +
+
+
{{ t('ui.dashboard.status.title', 'Status') }}
+
+
+
+
+ {{ t('ui.dashboard.status.bot_label', 'Bot Status') }} +
+ + {% if is_running %}{{ t('ui.dashboard.status.running', 'Running') }}{% else %}{{ t('ui.dashboard.status.idle', 'Idle') }}{% endif %} +
+
+
+ {{ t('ui.dashboard.status.mvp_label', 'MVP Milestone') }} + + {% if mvp_reached %} + {{ t('ui.dashboard.status.mvp_reached', 'Reached') }} + {% else %} + {{ t('ui.dashboard.status.mvp_progress', 'In Progress') }} + {% endif %} + +
+
+
+
+
+
+
+
+ +
+
+
+
{{ t('ui.dashboard.logs.title', 'Recent Logs') }}
+ +
+
+ 
{{ logs }}
+
+
+
+
+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/prompt_chip.html b/src/autometabuilder/web/templates/components/sections/prompt_chip.html new file mode 100644 index 0000000..884afb7 --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/prompt_chip.html @@ -0,0 +1,5 @@ +{# Prompt chip macro. #} +{% macro prompt_chip(target_id, snippet, label) -%} + +{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/prompt_section.html b/src/autometabuilder/web/templates/components/sections/prompt_section.html new file mode 100644 index 0000000..957c519 --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/prompt_section.html @@ -0,0 +1,99 @@ +{# Prompt section macro. #} +{% from "components/atoms/section_header.html" import section_header %} +{% from "components/atoms/helper_text.html" import helper_text %} +{% from "components/molecules/card.html" import card %} +{% from "components/sections/prompt_step.html" import prompt_step %} + +{% macro prompt_section() -%} +
+ {{ section_header(t('ui.prompt.title', 'Prompt Builder'), t('ui.prompt.subtitle', 'Shape how the assistant thinks, speaks, and decides')) }} + +
+
+ {% call card(t('ui.prompt.card.title', 'Prompt Builder'), "chat-square-text") %} +
+ +
+ {% set system_chips = [ + {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.senior.snippet', 'You are a senior software engineer focused on correctness and clarity.'), 'label': t('ui.prompt.chip.senior.label', 'Senior engineer')}, + {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.ask.snippet', 'Ask clarifying questions before making risky changes.'), 'label': t('ui.prompt.chip.ask.label', 'Ask questions')}, + {'target': 'system-prompt', 'snippet': t('ui.prompt.chip.minimal.snippet', 'Prefer minimal diffs and explain trade-offs.'), 'label': t('ui.prompt.chip.minimal.label', 'Minimal diffs')} + ] %} + {{ prompt_step(1, + t('ui.prompt.step1.title', 'Define the assistant'), + t('ui.prompt.step1.desc', 'Describe who the assistant is and how it should behave.'), + 'system-prompt', + 'system_content', + t('ui.prompt.step1.placeholder', 'You are a senior software engineer who prefers small, safe changes.'), + (prompt_content | extract_system_content), + 6, + system_chips + ) }} + + {% set user_chips = [ + {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.ux.snippet', 'Focus on UX polish, and avoid major refactors.'), 'label': t('ui.prompt.chip.ux.label', 'UX polish')}, + {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.tests.snippet', 'Add tests when possible, but avoid heavy scaffolding.'), 'label': t('ui.prompt.chip.tests.label', 'Add tests')}, + {'target': 'user-prompt', 'snippet': t('ui.prompt.chip.summarize.snippet', 'Summarize changes and suggest next steps.'), 'label': t('ui.prompt.chip.summarize.label', 'Summarize')} + ] %} + {{ prompt_step(2, + t('ui.prompt.step2.title', 'Give the mission'), + t('ui.prompt.step2.desc', 'Explain what the bot should accomplish right now.'), + 'user-prompt', + 'user_content', + t('ui.prompt.step2.placeholder', 'Review the repo, improve the UI, and summarize what changed.'), + (prompt_content | extract_user_content), + 5, + user_chips + ) }} + +
+ + {{ helper_text(t('ui.prompt.model.desc', 'Pick the balance of quality and speed that fits the task.')) }} + +
+
+ +
+ + {{ helper_text(t('ui.prompt.raw.desc', 'Edit the full YAML only if you need fine control.')) }} + +
+ +
+ + +
+
+ {% endcall %} +
+ +
+ {% call card(t('ui.prompt.guidance.title', 'Guidance'), "lightbulb") %} +
+
+ {{ t('ui.prompt.guidance.keep_human.title', 'Keep it human') }} +

{{ t('ui.prompt.guidance.keep_human.desc', 'Write instructions the way you would brief a teammate.') }}

+
+
+ {{ t('ui.prompt.guidance.be_specific.title', 'Be specific') }} +

{{ t('ui.prompt.guidance.be_specific.desc', 'Mention constraints like time, scope, or testing expectations.') }}

+
+
+ {{ t('ui.prompt.guidance.raw.title', 'Use advanced YAML sparingly') }} +

{{ t('ui.prompt.guidance.raw.desc', 'Only switch to raw YAML if you need full control.') }}

+
+
+ {% endcall %} +
+
+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/prompt_step.html b/src/autometabuilder/web/templates/components/sections/prompt_step.html new file mode 100644 index 0000000..c6ce78e --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/prompt_step.html @@ -0,0 +1,21 @@ +{# Prompt step macro. #} +{% from "components/atoms/helper_text.html" import helper_text %} +{% from "components/sections/prompt_chip.html" import prompt_chip %} + +{% macro prompt_step(step_number, title, description, textarea_id, name, placeholder, value, rows=5, chips=[]) -%} +
+
+ {{ step_number }} {{ title }} +
+ {{ helper_text(description) }} + + {% if chips %} +
+ {% for chip in chips %} + {{ prompt_chip(chip.target, chip.snippet, chip.label) }} + {% endfor %} +
+ {% endif %} +
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/settings_section.html b/src/autometabuilder/web/templates/components/sections/settings_section.html new file mode 100644 index 0000000..f284777 --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/settings_section.html @@ -0,0 +1,133 @@ +{# Settings section macro. #} +{% from "components/atoms/section_header.html" import section_header %} +{% from "components/organisms/callout.html" import callout %} + +{% macro settings_section() -%} +
+ {{ section_header(t('ui.settings.title', 'Settings'), t('ui.settings.subtitle', 'Configure services, security, and environment preferences')) }} + + {{ callout(t('ui.settings.callout.title', 'Human-friendly settings'), t('ui.settings.callout.body', 'Each field explains what it does. Add descriptions in metadata.json to keep custom settings readable for everyone.'), "info", "info-circle") }} + +
+
+ {% set settings_desc = metadata.get('settings_descriptions', {}) %} + +
+
+
+
{{ t('ui.settings.api_keys', 'API Keys') }}
+
+
+ {% for key in ['GITHUB_TOKEN', 'OPENAI_API_KEY', 'LITELLM_API_KEY'] %} + {% set desc = settings_desc.get(key, {}) %} +
+ +

{{ desc.get('description', '') }}

+ +
+ {% endfor %} +
+
+
+ +
+
+
+
{{ t('ui.settings.configuration', 'Configuration') }}
+
+
+ {% for key in ['GITHUB_REPOSITORY', 'LOG_LEVEL', 'APP_LANG', 'PROMPT_PATH'] %} + {% set desc = settings_desc.get(key, {}) %} +
+ +

{{ desc.get('description', '') }}

+ {% if desc.get('type') == 'select' %} + + {% else %} + + {% endif %} +
+ {% endfor %} +
+
+ +
+
+
{{ t('ui.settings.web_access', 'Web UI Access') }}
+
+
+ {% for key in ['WEB_USER', 'WEB_PASSWORD'] %} + {% set desc = settings_desc.get(key, {}) %} +
+ +

{{ desc.get('description', '') }}

+ +
+ {% endfor %} +
+
+
+
+ +
+
+
{{ t('ui.settings.other', 'Other Settings') }}
+
+
+
+ {% set known_keys = ['GITHUB_TOKEN', 'OPENAI_API_KEY', 'LITELLM_API_KEY', 'GITHUB_REPOSITORY', 'LOG_LEVEL', 'APP_LANG', 'PROMPT_PATH', 'WEB_USER', 'WEB_PASSWORD'] %} + {% for key, value in env_vars.items() %} + {% if key not in known_keys %} +
+
+ {% set desc = settings_desc.get(key, {}) %} + +

+ {{ desc.get('description', t('ui.settings.custom_default_desc', 'Custom environment setting. Add a description in metadata.json to show it here.')) }} +

+ +
+
+ {% endif %} + {% endfor %} +
+
+ +

{{ t('ui.settings.add.desc', 'Use uppercase keys with underscores, like API_TIMEOUT.') }}

+
+ + +
+
+
+
+
+
+ +
+
+
+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/translations_section.html b/src/autometabuilder/web/templates/components/sections/translations_section.html new file mode 100644 index 0000000..3d1d35a --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/translations_section.html @@ -0,0 +1,119 @@ +{# Translations section macro. #} +{% from "components/atoms/section_header.html" import section_header %} +{% from "components/molecules/empty_state.html" import empty_state %} + +{% macro translations_section() -%} +
+ {{ section_header(t('ui.translations.title', 'Translations'), t('ui.translations.subtitle', 'Create, edit, and maintain language files for bot messages')) }} + +
+
+
+
+
{{ t('ui.translations.languages', 'Languages') }}
+
+
+
+ {% for lang, file in translations.items() %} +
+
+ +
+ {{ lang.upper() }} + {{ file }} +
+
+
+ + {% if lang != 'en' %} + + {% endif %} +
+
+ {% endfor %} +
+
+
+
+ + +
+
+
+
+ +
+
+
+
{{ t('ui.translations.editor.title', 'Translation Editor') }}
+ +
+
+
+ {{ empty_state("translate", t('ui.translations.empty.title', 'Pick a language'), t('ui.translations.empty.body', 'Select a language from the list to start editing translations.')) }} +
+ +
+
+
+
+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/components/sections/workflow_section.html b/src/autometabuilder/web/templates/components/sections/workflow_section.html new file mode 100644 index 0000000..384c1de --- /dev/null +++ b/src/autometabuilder/web/templates/components/sections/workflow_section.html @@ -0,0 +1,34 @@ +{# Workflow section macro. #} +{% from "components/atoms/section_header.html" import section_header %} + +{% macro workflow_section() -%} +
+ {{ section_header(t('ui.workflow.title', 'Workflow Builder'), t('ui.workflow.subtitle', "Design the bot's task execution pipeline")) }} + +
+
+
{{ t('ui.workflow.card.title', 'Tasks & Steps') }}
+
+ +
+
+
+
+ +
+
+ +
+ +
+
+
+
+
+{%- endmacro %} diff --git a/src/autometabuilder/web/templates/index.html b/src/autometabuilder/web/templates/index.html index eed7b02..1bac4d2 100644 --- a/src/autometabuilder/web/templates/index.html +++ b/src/autometabuilder/web/templates/index.html @@ -1,12 +1,16 @@ {% extends "base.html" %} -{% import "components/sections.html" as sections with context %} +{% from "components/sections/dashboard_section.html" import dashboard_section with context %} +{% from "components/sections/workflow_section.html" import workflow_section with context %} +{% from "components/sections/prompt_section.html" import prompt_section with context %} +{% from "components/sections/settings_section.html" import settings_section with context %} +{% from "components/sections/translations_section.html" import translations_section with context %} {% block content %} -{{ sections.dashboard_section() }} -{{ sections.workflow_section() }} -{{ sections.prompt_section() }} -{{ sections.settings_section() }} -{{ sections.translations_section() }} +{{ dashboard_section() }} +{{ workflow_section() }} +{{ prompt_section() }} +{{ settings_section() }} +{{ translations_section() }} {% endblock %} {% block scripts %}