webui/components/projects/project-edit-instructions.html

<html>

<head>
    <title>Create a new project</title>
    <script type="module">
        import { store } from "/components/projects/projects-store.js";
    </script>
</head>

<body>
    <div x-data>
        <template x-if="$store.projects && $store.projects.selectedProject">
            <div>
                <!-- <div class="project-detail-header">
                        <div class="projects-project-card-title">Project details</div>
                        <div class="project-path" x-text="$store.projects.selectedProject.path"></div>
                    </div> -->

                <div class="projects-form-group">
                    <label class="projects-form-label">Description</label>
                    <span class="projects-form-description">Describe the project. This helps both you and the agent
                        understand the project context.</span>
                    <textarea class="projects-form-textarea" x-model="$store.projects.selectedProject.description"
                        rows="5" placeholder="Enter project description"></textarea>
                </div>

                <div class="projects-form-group">
                    <label class="projects-form-label">Instructions</label>
                    <span class="projects-form-description">Provide specific instructions for the agent related to this
                        project.</span>
                    <textarea class="projects-form-textarea"
                        x-model="$store.projects.selectedProject.instructions" rows="15"
                        placeholder="Enter project instructions"></textarea>
                </div>

                <div class="projects-setting-row" style="padding: 1rem 0;">
                    <div class="projects-setting-text">
                        <label class="projects-form-label">Include top-level AGENTS.md</label>
                        <span class="projects-form-description">When turned on, Agent Zero will include the project's
                            top-level AGENTS.md file in the active project instructions when that file exists.</span>
                    </div>
                    <div class="projects-setting-control">
                        <label class="toggle">
                            <input type="checkbox" x-model="$store.projects.selectedProject.include_agents_md">
                            <span class="toggler"></span>
                        </label>
                    </div>
                </div>

                <div class="projects-form-group">
                    <label class="projects-form-label">Instruction files</label>
                    <div class="projects-input-with-button-wrapper">
                        <span class="projects-form-description">Additional instruction files in <strong><span
                                    x-text="$store.projects.getSelectedAbsPath('.a0proj','instructions')"></span></strong>. Only text files are currently supported (txt, md, yaml, no PDFs or images).</span>
                        <span class="projects-form-description">Currently there are <strong><span
                                    x-text="$store.projects.selectedProject.instruction_files_count || 0"></span></strong> instruction files.</span>
                        <button class="button icon-button" x-on:click="$store.projects.browseInstructionFiles()">
                            <x-icon class="icon" name="folder"></x-icon>
                            <span>Browse</span>
                        </button>
                    </div>
                </div>
            </div>


        </template>
    </div>
</body>
<style>
</style>

</html>