feat: initial design with listing functionality

tegarimansyah · Jun 25, 2023 · 84d6257 · 84d6257 · vercel · Jun 26, 2023
1 parent 8f31ec4
commit 84d6257
Show file tree

Hide file tree

Showing 17 changed files with 624 additions and 36 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -2,7 +2,7 @@
 	"useTabs": true,
 	"singleQuote": true,
 	"trailingComma": "none",
-	"printWidth": 100,
+	"printWidth": 120,
 	"plugins": ["prettier-plugin-svelte"],
 	"pluginSearchDirs": ["."],
 	"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]

diff --git a/README.md b/README.md
@@ -1,38 +1,26 @@
-# create-svelte
+# Github Declutter
 
-Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
+Declutter your unused repo. Create your github personal access token, give permission for these scopes:
 
-## Creating a project
+* repo
+* gist
+* delete_repo
 
-If you're seeing this, you've probably already done this step. Congrats!
+then declutter your repo.
 
-```bash
-# create a new project in the current directory
-npm create svelte@latest
+![docs/img/screenshot.png](docs/img/screenshot.png)
 
-# create a new project in my-app
-npm create svelte@latest my-app
-```
-
-## Developing
-
-Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
-
-```bash
-npm run dev
+## Deveelopment
 
-# or start the server and open the app in a new browser tab
-npm run dev -- --open
+```sh
+$ npm install
+$ npm run dev -- --host
 ```
 
-## Building
-
-To create a production version of your app:
-
-```bash
-npm run build
-```
+## To Do
 
-You can preview the production build with `npm run preview`.
+* [ ] Actually delete the repo (currently just console log it)
+* [ ] Implement Vuex for toggle and username+token
+* [ ] Sort by
+* [ ] Multiple deletion
 
-> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
diff --git a/docs/img/screenshot.png b/docs/img/screenshot.png
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -15,6 +15,7 @@
 		"@sveltejs/adapter-auto": "^2.0.0",
 		"@sveltejs/kit": "^1.20.4",
 		"autoprefixer": "^10.4.14",
+		"daisyui": "^3.1.6",
 		"eslint": "^8.28.0",
 		"eslint-config-prettier": "^8.5.0",
 		"eslint-plugin-svelte": "^2.30.0",
@@ -27,5 +28,9 @@
 		"typescript": "^5.0.0",
 		"vite": "^4.3.6"
 	},
-	"type": "module"
+	"type": "module",
+	"dependencies": {
+		"axios": "^1.4.0",
+		"clsx": "^1.2.1"
+	}
 }
diff --git a/src/app.html b/src/app.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" data-theme="light">
 	<head>
 		<meta charset="utf-8" />
 		<link rel="icon" href="%sveltekit.assets%/favicon.png" />

diff --git a/src/lib/components/Auth.svelte b/src/lib/components/Auth.svelte
@@ -0,0 +1,39 @@
+<script lang="ts">
+	import { userStore, patStore } from '$lib/utils/store';
+	import { github } from '$lib/utils/github';
+	import { AxiosError } from 'axios';
+
+	let pat = '';
+
+	async function fetchRepos() {
+		patStore.set(pat);
+		try {
+			const response = await github.get('/user');
+			userStore.set({ ...response.data, total_repos: 0 });
+		} catch (error) {
+			if (error instanceof AxiosError) {
+				if (error.response !== undefined) {
+					if (error.response.status === 401) {
+						alert('Your token is not valid');
+					} else {
+						alert(`Something went wrong: "${error.message}" with code ${error.response.status}`);
+					}
+				} else {
+					alert(`Something went wrong: ${error.message}`);
+				}
+			} else {
+				alert(error);
+			}
+		}
+	}
+</script>
+
+<form class="mt-10" on:submit|preventDefault={fetchRepos}>
+	<input
+		bind:value={pat}
+		type="password"
+		placeholder="Github Token"
+		class="input input-bordered border-gray-500 w-full max-w-xs mr-4"
+	/>
+	<button class="btn btn-outline" type="submit">Fetch Data</button>
+</form>