[vercel-tutor] Move files / add loading indicator (#1043)

### Description

- Rename files from `<step-name>/page.tsx` to `<step-name>.tsx` to
prevent them from being built
- Add simple loading states to links


https://github.com/user-attachments/assets/251f8dd3-7a04-4a33-9862-5d4266145a47


https://github.com/user-attachments/assets/998c9a36-8af3-4bb6-8951-f50f9ccc8802

### Type of Change

- [ ] New Example
- [x] Example updates (Bug fixes, new features, etc.)
- [ ] Other (changes to the codebase, but not to examples)

Author: chibicode

vercel-tutor/app/helpful-links/page.tsx renamed to vercel-tutor/app/helpful-links.tsx

@@ -27,6 +27,7 @@ function Circle() {
 
 export default function Home() {
   const [nextUrl, setNextUrl] = useState("#");
+  const [isLoading, setIsLoading] = useState(false);
 
   useEffect(() => {
     const host = window.location.hostname;
@@ -74,8 +75,15 @@ export default function Home() {
           <a
             className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground font-medium text-background hover:bg-[#383838] dark:hover:bg-[#ccc] h-12 font-[family-name:var(--font-geist-sans)]"
             href={nextUrl}
+            onClick={(e) => {
+              if (isLoading) {
+                e.preventDefault();
+              } else {
+                setIsLoading(true);
+              }
+            }}
           >
-            View Pull Request
+            {isLoading ? 'Loading…' : 'View Pull Request'}
           </a>
           <a
             className="font-[family-name:var(--font-geist-sans)] text-secondary hover:underline flex items-center justify-center h-12 font-medium"

vercel-tutor/app/page.tsx

@@ -47,6 +47,7 @@ function Check() {
 
 export default function Home() {
   const [nextUrl, setNextUrl] = useState("#");
+  const [isLoading, setIsLoading] = useState(false);
 
   useEffect(() => {
     const host = window.location.hostname;
@@ -119,8 +120,15 @@ export default function Home() {
           <a
             className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground font-medium text-background hover:bg-[#383838] dark:hover:bg-[#ccc] h-12 font-[family-name:var(--font-geist-sans)]"
             href={nextUrl}
+            onClick={(e) => {
+              if (isLoading) {
+                e.preventDefault();
+              } else {
+                setIsLoading(true);
+              }
+            }}
           >
-            Push Commit and Merge Pull Request
+            {isLoading ? 'Loading…' : 'Push Commit and Merge Pull Request'}
           </a>
           <a
             className="font-[family-name:var(--font-geist-sans)] text-secondary hover:underline flex items-center justify-center h-12 font-medium"

vercel-tutor/app/smaller-triangle/page.tsx renamed to vercel-tutor/app/smaller-triangle.tsx

@@ -6,7 +6,7 @@
       "branchName": "main"
     },
     "target": {
-      "templatePath": "app/smaller-triangle/page.tsx",
+      "templatePath": "app/smaller-triangle.tsx",
       "branchName": "vercel-bot-patch"
     },
     "path": "app/page.tsx",
@@ -17,11 +17,11 @@
   "helpful-links": {
     "type": "commit-merge-comment",
     "base": {
-      "templatePath": "app/smaller-triangle/page.tsx",
+      "templatePath": "app/smaller-triangle.tsx",
       "branchName": "vercel-bot-patch"
     },
     "target": {
-      "templatePath": "app/helpful-links/page.tsx",
+      "templatePath": "app/helpful-links.tsx",
       "branchName": "vercel-bot-patch"
     },
     "path": "app/page.tsx",