partial oauth related strategy/impl

packages/gui/src-tauri/tauri.conf.json

@@ -15,7 +15,7 @@
 			"http": {
 				"all": true,
 				"request": true,
-				"scope": ["https://api.tea.xyz/v1/*", "https://github.com/*"]
+				"scope": ["https://api.tea.xyz/v1/*", "https://github.com/*", "http://localhost:3000/v1/*"]
 			},
 			"shell": {
 				"all": true,

packages/gui/src/components/Auth/Auth.svelte

@@ -0,0 +1,46 @@
+<script lang="ts">
+  import Button from '@tea/ui/Button/Button.svelte';
+	import { open } from '@tauri-apps/api/shell';
+  import { getDeviceAuth } from '@api';
+
+  const authPage = 'http://localhost:3000/v1'; // https://api.tea.xyz/v1/auth/user?device_id=device_id
+
+  let statusMessage = '';
+
+  let timer: NodeJS.Timer;
+
+  let loop = 0;
+
+	const openGithub = () => {
+		open(authPage);
+		try {
+      if (!timer) {
+        timer = setInterval(pollAuth, 5000)
+      } 
+		} catch (error) {
+			console.error(error);
+		}
+	};
+
+  const pollAuth = async () => {
+    loop++;
+    try {
+      const data = await getDeviceAuth();
+      console.log('dd:',data);
+      if (data.status === 'SUCCESS') {
+        clearInterval(timer);
+      }
+      statusMessage = data.status;
+    } catch (error) {
+      console.error(error);
+    }
+
+    if (loop > 20 && timer) {
+      clearInterval(timer);
+      loop = 0;
+    }
+  }
+</script>
+
+<p>{loop}:{statusMessage}</p>
+<Button onClick={openGithub}>login</Button>

packages/gui/src/libs/api/mock.ts

@@ -322,3 +322,12 @@ export async function getCategorizedPackages(): Promise<Category[]> {
 		}
 	];
 }
+
+export async function getDeviceAuth(): Promise<any> {
+	const deviceId = 'xyz123';
+	// const data = await get<any>(`/auth/device/${deviceId}`);
+	return {
+		status: 'SUCCESS',
+		user: {},
+	};
+}

packages/gui/src/libs/api/tauri.ts

@@ -14,16 +14,19 @@ import { getClient } from '@tauri-apps/api/http';
 // import { invoke } from '@tauri-apps/api';
 import { Command } from '@tauri-apps/api/shell';
 import { readDir, BaseDirectory } from '@tauri-apps/api/fs';
-import type { Package, Review, AirtablePost } from '@tea/ui/types';
+import type { Package, Review, AirtablePost, User } from '@tea/ui/types';
-import type { GUIPackage, Course, Category } from '../types';
+import type { GUIPackage, Course, Category, AuthStatus } from '../types';
 import * as mock from './mock';
 import { PackageStates } from '../types';
 
 const base = 'https://api.tea.xyz/v1';
+// const base = 'http://localhost:3000/v1';
 
 async function get<T>(path: string, query?: { [key: string]: string }) {
+	console.log('path', path);
 	const client = await getClient();
 	const uri = join(base, path);
+	console.log('uri:', uri);
 	const { data } = await client.get<T>(uri.toString(), {
 		headers: {
 			Authorization: 'public' // TODO: figure out why req w/o Authorization does not work
@@ -161,3 +164,14 @@ export async function getCategorizedPackages(): Promise<Category[]> {
 	const categories = await get<Category[]>('/packages/categorized');
 	return categories;
 }
+
+type DeviceAuth = {
+	status: AuthStatus;
+	user: User;
+}
+
+export async function getDeviceAuth(): Promise<DeviceAuth> {
+	const deviceId = 'xyxz123';
+	const data = await get<DeviceAuth>(`/auth/device/${deviceId}`);
+	return data;
+}

packages/gui/src/libs/types.ts

@@ -29,3 +29,10 @@ export type Category = {
 	cta_label: string;
 	packages: GUIPackage[];
 };
+
+export enum AuthStatus {
+	UNKNOWN = 'UNKNOWN',
+	PENDING = 'PENDING',
+	SUCCESS = 'SUCCESS',
+	FAILED = 'FAILED',
+}

packages/gui/src/routes/+page.svelte

@@ -9,6 +9,7 @@
 	import News from '$components/News/News.svelte';
 	import CategorizedPackages from '$components/CategorizedPackages/CategorizedPackages.svelte';
 	backLink.set('');
+	console.log("test", window.location)
 </script>
 
 <div>

packages/gui/src/routes/profile/+page.svelte

@@ -6,12 +6,15 @@
 	import Badges from '$components/Badges/Badges.svelte';
 	import InstalledPackages from '$components/InstalledPackages/InstalledPackages.svelte';
 	import { backLink } from '$libs/stores';
+	import Auth from '$components/Auth/Auth.svelte';
 	backLink.set('/');
 </script>
 
 <div>
 	<PageHeader>PROFILE</PageHeader>
-
+	<section>
+		<Auth/>
+	</section>
 	<section>
 		<ProfileBanner />
 	</section>

packages/ui/src/types.ts

@@ -34,3 +34,9 @@ export type AirtablePost = {
 	published_at: Date;
 	tags: string[];
 };
+
+export type User = {
+	username: string;
+	country?: string;
+	eth_wallet_address?: string;
+}