1
- // import { useEffect, useState } from "react";
2
- // import InstillClient, {
3
- // Nullable,
4
- // Pipeline,
5
- // User,
6
- // } from "@instill-ai/typescript-sdk";
7
-
8
- // export default function TypescriptSdkDemo() {
9
- // const [pipelines, setPipelines] = useState<Pipeline[]>([]);
10
- // const [user, setUser] = useState<User[]>([]);
11
- // const [token, setToken] = useState<Nullable<string>>(null);
12
-
13
- // const client = new InstillClient("http://localhost:8080", "v1alpha", token);
14
-
15
- // const login = async () => {
16
- // const userToken = await client.Auth.authLoginAction({
17
- // payload: {
18
- // username: "admin",
19
- // password: "password",
20
- // },
21
- // });
22
- // setToken(userToken);
23
- // };
24
-
25
- // useEffect(() => {
26
- // login();
27
- // }, []);
28
-
29
- // useEffect(() => {
30
- // if (token) {
31
- // client.Auth.getUserQuery()
32
- // .then((data: any) => {
33
- // console.log("data", data);
34
- // setUser(data);
35
- // })
36
- // .catch((error: any) => {
37
- // console.log("error", error);
38
- // });
39
-
40
- // client.Pipeline.listPipelinesQuery({
41
- // pageSize: null,
42
- // nextPageToken: null,
43
- // })
44
- // .then((data: any) => {
45
- // console.log("data", data);
46
- // setPipelines(data);
47
- // })
48
- // .catch((error: any) => {
49
- // console.log("error", error);
50
- // });
51
- // }
52
- // }, [token]);
53
-
54
- // return (
55
- // <>
56
- // <h1>User Data</h1>
57
- // <pre style={{ backgroundColor: "white" }}>
58
- // {JSON.stringify(user, null, 4)}
59
- // </pre>
60
-
61
- // <h1>Pipelines List</h1>
62
- // <pre style={{ backgroundColor: "white" }}>
63
- // {JSON.stringify(pipelines, null, 4)}
64
- // </pre>
65
- // </>
66
- // );
67
- // }
68
-
69
- // Console Token Implementation
70
-
71
1
import { useEffect , useState } from "react" ;
72
2
import InstillClient , {
73
3
Nullable ,
@@ -78,34 +8,37 @@ import InstillClient, {
78
8
export default function TypescriptSdkDemo ( ) {
79
9
const [ pipelines , setPipelines ] = useState < Pipeline [ ] > ( [ ] ) ;
80
10
const [ user , setUser ] = useState < User [ ] > ( [ ] ) ;
11
+ const [ token , setToken ] = useState < Nullable < string > > ( null ) ;
81
12
82
13
const client = new InstillClient (
83
- "https ://api.instill.tech " ,
14
+ "http ://localhost:8080 " ,
84
15
"v1alpha" ,
85
- "instill_sk_OwuGQ8RGL6ObzYsneAG9Mib1k6zi9Gmj " // console API token
16
+ "instill_sk_pgybOAbZmtjB7S5DTDJcmryE7utibLAN " // console API token from http://localhost:3000/settings
86
17
) ;
87
18
88
19
useEffect ( ( ) => {
89
- client . Auth . getUserQuery ( )
90
- . then ( ( data : any ) => {
91
- console . log ( "data" , data ) ;
92
- setUser ( data ) ;
20
+ if ( token ) {
21
+ client . Auth . getUserQuery ( )
22
+ . then ( ( data : any ) => {
23
+ console . log ( "data" , data ) ;
24
+ setUser ( data ) ;
25
+ } )
26
+ . catch ( ( error : any ) => {
27
+ console . log ( "error" , error ) ;
28
+ } ) ;
29
+
30
+ client . Pipeline . listPipelinesQuery ( {
31
+ pageSize : null ,
32
+ nextPageToken : null ,
93
33
} )
94
- . catch ( ( error : any ) => {
95
- console . log ( "error" , error ) ;
96
- } ) ;
97
-
98
- client . Pipeline . listPipelinesQuery ( {
99
- pageSize : null ,
100
- nextPageToken : null ,
101
- } )
102
- . then ( ( data : any ) => {
103
- console . log ( "data" , data ) ;
104
- setPipelines ( data ) ;
105
- } )
106
- . catch ( ( error : any ) => {
107
- console . log ( "error" , error ) ;
108
- } ) ;
34
+ . then ( ( data : any ) => {
35
+ console . log ( "data" , data ) ;
36
+ setPipelines ( data ) ;
37
+ } )
38
+ . catch ( ( error : any ) => {
39
+ console . log ( "error" , error ) ;
40
+ } ) ;
41
+ }
109
42
} , [ ] ) ;
110
43
111
44
return (
@@ -122,3 +55,60 @@ export default function TypescriptSdkDemo() {
122
55
</ >
123
56
) ;
124
57
}
58
+
59
+ // Console Token Implementation
60
+
61
+ // import { useEffect, useState } from "react";
62
+ // import InstillClient, {
63
+ // Nullable,
64
+ // Pipeline,
65
+ // User,
66
+ // } from "@instill-ai/typescript-sdk";
67
+
68
+ // export default function TypescriptSdkDemo() {
69
+ // const [pipelines, setPipelines] = useState<Pipeline[]>([]);
70
+ // const [user, setUser] = useState<User[]>([]);
71
+
72
+ // const client = new InstillClient(
73
+ // "https://api.instill.tech",
74
+ // "v1alpha",
75
+ // "instill_sk_OwuGQ8RGL6ObzYsneAG9Mib1k6zi9Gmj" // console API token
76
+ // );
77
+
78
+ // useEffect(() => {
79
+ // client.Auth.getUserQuery()
80
+ // .then((data: any) => {
81
+ // console.log("data", data);
82
+ // setUser(data);
83
+ // })
84
+ // .catch((error: any) => {
85
+ // console.log("error", error);
86
+ // });
87
+
88
+ // client.Pipeline.listPipelinesQuery({
89
+ // pageSize: null,
90
+ // nextPageToken: null,
91
+ // })
92
+ // .then((data: any) => {
93
+ // console.log("data", data);
94
+ // setPipelines(data);
95
+ // })
96
+ // .catch((error: any) => {
97
+ // console.log("error", error);
98
+ // });
99
+ // }, []);
100
+
101
+ // return (
102
+ // <>
103
+ // <h1>User Data</h1>
104
+ // <pre style={{ backgroundColor: "white" }}>
105
+ // {JSON.stringify(user, null, 4)}
106
+ // </pre>
107
+
108
+ // <h1>Pipelines List</h1>
109
+ // <pre style={{ backgroundColor: "white" }}>
110
+ // {JSON.stringify(pipelines, null, 4)}
111
+ // </pre>
112
+ // </>
113
+ // );
114
+ // }
0 commit comments