update files

dist/main.js

@@ -299,7 +299,7 @@ async function getOrganizationInfo(accessToken) {
   }
   return response.json();
 }
-async function createRepository(accessToken, name) {
+async function createRepository(accessToken, name, organization) {
   const response = await fetch("https://huggingface.co/api/repos/create", {
     method: "POST",
     headers: {
@@ -309,6 +309,7 @@ async function createRepository(accessToken, name) {
     body: JSON.stringify({
       type: "model",
       name,
+      organization,
       private: false
     })
   });
@@ -334,9 +335,13 @@ var init = async () => {
     if (createRepoButton && repoNameInput) {
       createRepoButton.onclick = async () => {
         const repoName = repoNameInput.value.trim();
+        const orgSelect = document.getElementById(
+          "org-select"
+        );
         if (repoName) {
           try {
-            await createRepository(accessToken, repoName);
+            const selectedOrg = orgSelect?.value || void 0;
+            await createRepository(accessToken, repoName, selectedOrg);
             repoNameInput.value = "";
             alert("Repository created successfully!");
           } catch (error) {
@@ -348,6 +353,17 @@ var init = async () => {
     }
     try {
       const orgInfo = await getOrganizationInfo(accessToken);
+      const orgSelect = document.getElementById(
+        "org-select"
+      );
+      if (orgSelect && orgInfo.organizations) {
+        orgInfo.organizations.forEach((org) => {
+          const option = document.createElement("option");
+          option.value = org.name;
+          option.textContent = org.name;
+          orgSelect.appendChild(option);
+        });
+      }
       const preElement = document.querySelector("pre");
       if (preElement) {
         preElement.textContent = JSON.stringify(

index.html

@@ -16,6 +16,9 @@
             <button id="signout" style="display: none;" class="auth-button">Sign out</button>
         </div>
         <div id="repo-form" style="display: none;" class="repo-form">
+            <select id="org-select" class="repo-input">
+                <option value="">Personal Account</option>
+            </select>
             <input type="text" id="repo-name" placeholder="Enter repository name" class="repo-input">
             <button id="create-repo" class="repo-button">Create Repository</button>
         </div>

src/main.ts

@@ -41,7 +41,8 @@ async function getOrganizationInfo(
 
 async function createRepository(
   accessToken: string,
-  name: string
+  name: string,
+  organization?: string
 ): Promise<void> {
   const response = await fetch("https://huggingface.co/api/repos/create", {
     method: "POST",
@@ -52,6 +53,7 @@ async function createRepository(
     body: JSON.stringify({
       type: "model",
       name: name,
+      organization: organization,
       private: false,
     }),
   });
@@ -84,9 +86,13 @@ const init = async (): Promise<void> => {
     if (createRepoButton && repoNameInput) {
       createRepoButton.onclick = async () => {
         const repoName = repoNameInput.value.trim();
+        const orgSelect = document.getElementById(
+          "org-select"
+        ) as HTMLSelectElement;
         if (repoName) {
           try {
-            await createRepository(accessToken, repoName);
+            const selectedOrg = orgSelect?.value || undefined;
+            await createRepository(accessToken, repoName, selectedOrg);
             repoNameInput.value = ""; // Clear input after success
             alert("Repository created successfully!");
           } catch (error) {
@@ -97,9 +103,24 @@ const init = async (): Promise<void> => {
       };
     }
 
-    // Get organization info after successful authentication
+    // Get organization info and populate org select after successful authentication
     try {
       const orgInfo = await getOrganizationInfo(accessToken);
+
+      // Populate org select
+      const orgSelect = document.getElementById(
+        "org-select"
+      ) as HTMLSelectElement;
+      if (orgSelect && orgInfo.organizations) {
+        orgInfo.organizations.forEach((org) => {
+          const option = document.createElement("option");
+          option.value = org.name;
+          option.textContent = org.name;
+          orgSelect.appendChild(option);
+        });
+      }
+
+      // Display full info in pre element
       const preElement = document.querySelector("pre");
       if (preElement) {
         preElement.textContent = JSON.stringify(

styles/main.css

@@ -53,9 +53,14 @@ h2 {
   margin: 2rem auto;
   max-width: 400px;
   display: flex;
+  flex-wrap: wrap;
   gap: 1rem;
 }
 
+.repo-form select.repo-input {
+  min-width: 200px;
+}
+
 .repo-input {
   flex: 1;
   padding: 0.8rem;