Add react example (#2)

iamelevich · Feb 6, 2023 · 741fe79 · 741fe79
1 parent 2133247
commit 741fe79
Show file tree

Hide file tree

Showing 20 changed files with 3,728 additions and 2 deletions.
diff --git a/.idea/pocketbase-plugin-telegram-auth.iml b/.idea/pocketbase-plugin-telegram-auth.iml
diff --git a/README.md b/README.md
@@ -57,7 +57,18 @@ After that new route `POST /api/collections/users/auth-with-telegram` will be av
 
 ### Usage
 
-TODO
+Simple usage with js. You can check react example [here](./examples/webapp-react)
+```js
+const pb = new PocketBase('http://127.0.0.1:8090');
+pb.send('/api/collections/users/auth-with-telegram', {
+    method: 'POST',
+    body: {
+        data: window.Telegram.WebApp.initData
+    }
+}).then(res => {
+    pb.authStore.save(res.token, res.record);
+});
+```
 
 ## Contributing
 

diff --git a/examples/webapp-react/.envrc b/examples/webapp-react/.envrc
@@ -0,0 +1 @@
+use asdf;
diff --git a/examples/webapp-react/.gitignore b/examples/webapp-react/.gitignore
@@ -0,0 +1,7 @@
+# ignore everything
+/*
+
+# exclude from the ignore filter
+!.gitignore
+!tg_webapp/
+!main.go
diff --git a/examples/webapp-react/.tool-versions b/examples/webapp-react/.tool-versions
@@ -0,0 +1 @@
+nodejs 18.13.0
diff --git a/examples/webapp-react/main.go b/examples/webapp-react/main.go
@@ -0,0 +1,32 @@
+package main
+
+import (
+	tgAuthPlugin "github.com/iamelevich/pocketbase-plugin-telegram-auth"
+	"github.com/pocketbase/pocketbase/apis"
+	"github.com/pocketbase/pocketbase/core"
+	"log"
+	"os"
+
+	"github.com/pocketbase/pocketbase"
+)
+
+func main() {
+	app := pocketbase.New()
+
+	// Setup tg auth for users collection
+	tgAuthPlugin.MustRegister(app, &tgAuthPlugin.Options{
+		BotToken:      "6086153355:AAHQR0dRvmboEIfbsPT93GHczOnT355gmUE", // Better to use ENV variable for that
+		CollectionKey: "users",
+	})
+
+	// Setup serving bundled react app
+	app.OnBeforeServe().Add(func(e *core.ServeEvent) error {
+		// serves static files from the provided public dir (if exists)
+		e.Router.GET("/*", apis.StaticDirectoryHandler(os.DirFS("./tg_webapp/dist"), true))
+		return nil
+	})
+
+	if err := app.Start(); err != nil {
+		log.Fatal(err)
+	}
+}
diff --git a/examples/webapp-react/tg_webapp/.gitignore b/examples/webapp-react/tg_webapp/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/examples/webapp-react/tg_webapp/index.html b/examples/webapp-react/tg_webapp/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React + TS</title>
+
+    <script src="https://telegram.org/js/telegram-web-app.js"></script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>