Add AGENTS.md and Ember Best Practices skill

.agents/skills/ember-best-practices/rules/route-templates.md

@@ -0,0 +1,112 @@
+---
+title: Use Separate Route and Template Files
+impact: MEDIUM-HIGH
+impactDescription: Better code organization and maintainability
+tags: routes, templates, gjs, file-conventions
+---
+
+## Use Separate Route and Template Files
+
+Keep route logic in `app/routes/*.js` and route templates in `app/templates/*.gjs`. Route classes imported from `@ember/routing/route` do not support inline `<template>` blocks.
+
+**Incorrect (inline template inside a route class):**
+
+```glimmer-js
+// app/routes/posts.gjs
+import Route from '@ember/routing/route';
+
+export default class PostsRoute extends Route {
+  model() {
+    return this.store.request({ url: '/posts' });
+  }
+
+  <template>
+    <h1>Posts</h1>
+    <ul>
+      {{#each @model as |post|}}
+        <li>{{post.title}}</li>
+      {{/each}}
+    </ul>
+
+    {{outlet}}
+  </template>
+}
+```
+
+**Correct (separate route module and template file):**
+
+```javascript
+// app/routes/posts.js
+import Route from '@ember/routing/route';
+
+export default class PostsRoute extends Route {
+  model() {
+    return this.store.request({ url: '/posts' });
+  }
+}
+```
+
+```glimmer-js
+// app/templates/posts.gjs
+<template>
+  <h1>Posts</h1>
+  <ul>
+    {{#each @model as |post|}}
+      <li>{{post.title}}</li>
+    {{/each}}
+  </ul>
+
+  {{outlet}}
+</template>
+```
+
+**With a separate template file for route UI:**
+
+```javascript
+// app/routes/posts.js
+import Route from '@ember/routing/route';
+import { service } from '@ember/service';
+
+export default class PostsRoute extends Route {
+  @service store;
+
+  model() {
+    return this.store.request({ url: '/posts' });
+  }
+}
+```
+
+```glimmer-js
+// app/templates/posts.gjs
+<template>
+  <div class="posts-page">
+    <h1>Posts</h1>
+
+    {{#if @model}}
+      <ul>
+        {{#each @model as |post|}}
+          <li>{{post.title}}</li>
+        {{/each}}
+      </ul>
+    {{/if}}
+
+    {{outlet}}
+  </div>
+</template>
+```
+
+**Template-only routes:**
+
+```glimmer-js
+// app/templates/about.gjs
+<template>
+  <div class="about-page">
+    <h1>About Us</h1>
+    <p>Welcome to our application!</p>
+  </div>
+</template>
+```
+
+Keeping route classes and route templates in their conventional files matches Ember's supported routing model and makes examples easier to apply in real apps.
+
+Reference: [Ember Routes](https://guides.emberjs.com/release/routing/)