From ac6a4e44acd74216db1c687b3fd607b79cc3520d Mon Sep 17 00:00:00 2001
From: Garrett Johnson <garrett.kjohnson@gmail.com>
Date: Tue, 14 Jan 2025 11:53:44 +0900
Subject: [PATCH] update r3f examples

---
 example/r3f/atmosphere.jsx | 13 +++----------
 example/r3f/globe.jsx      | 11 +++--------
 2 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/example/r3f/atmosphere.jsx b/example/r3f/atmosphere.jsx
index 8ab1dab4a..100860a66 100644
--- a/example/r3f/atmosphere.jsx
+++ b/example/r3f/atmosphere.jsx
@@ -13,7 +13,7 @@ import {
 
 // Plugins
 import {
-	GoogleCloudAuthPlugin,
+	CesiumIonAuthPlugin,
 	UpdateOnChangePlugin,
 	TileCompressionPlugin,
 	TilesFadePlugin,
@@ -64,11 +64,6 @@ const dracoLoader = new DRACOLoader().setDecoderPath( 'https://www.gstatic.com/d
 function App() {
 
 	const levaParams = {
-		apiToken: {
-			value: localStorage.getItem( 'google-token' ) || 'put-your-api-key-here',
-			onChange: ( value ) => localStorage.setItem( 'google-token', value ),
-			transient: false,
-		},
 		ortho: false,
 	};
 
@@ -103,13 +98,11 @@ function App() {
 
 	} );
 
-	window.CAMERA = camera;
-
-	const { apiToken, ortho } = useControls( levaParams );
+	const { ortho } = useControls( levaParams );
 	return (
 		<>
 			<TilesRenderer>
-				<TilesPlugin plugin={ GoogleCloudAuthPlugin } args={ { apiToken } } />
+				<TilesPlugin plugin={ CesiumIonAuthPlugin } args={ { apiToken: import.meta.env.VITE_ION_KEY, assetId: '2275207', autoRefreshToken: true } } />
 				<TilesPlugin plugin={ GLTFExtensionsPlugin } dracoLoader={ dracoLoader } />
 				<TilesPlugin plugin={ TileCompressionPlugin } />
 				<TilesPlugin plugin={ UpdateOnChangePlugin } />
diff --git a/example/r3f/globe.jsx b/example/r3f/globe.jsx
index 2554e9fba..0e24d7010 100644
--- a/example/r3f/globe.jsx
+++ b/example/r3f/globe.jsx
@@ -14,7 +14,7 @@ import {
 
 // Plugins
 import {
-	GoogleCloudAuthPlugin,
+	CesiumIonAuthPlugin,
 	UpdateOnChangePlugin,
 	TileCompressionPlugin,
 	TilesFadePlugin,
@@ -74,11 +74,6 @@ function Pointer() {
 function App() {
 
 	const levaParams = {
-		apiToken: {
-			value: localStorage.getItem( 'google-token' ) || 'put-your-api-key-here',
-			onChange: ( value ) => localStorage.setItem( 'google-token', value ),
-			transient: false,
-		},
 		ortho: false,
 	};
 
@@ -86,7 +81,7 @@ function App() {
 	// - see if we should trigger an invalidate on tiles plugin add and params change
 	// - see if we need to trigger a force update on plugin add for the UpdateOnChange plugin
 
-	const { apiToken, ortho } = useControls( levaParams );
+	const { ortho } = useControls( levaParams );
 	return (
 		<Canvas
 			frameloop='demand'
@@ -106,7 +101,7 @@ function App() {
 			<color attach="background" args={ [ 0x111111 ] } />
 
 			<TilesRenderer group={ { rotation: [ - Math.PI / 2, 0, 0 ] } }>
-				<TilesPlugin plugin={ GoogleCloudAuthPlugin } args={ { apiToken } } />
+				<TilesPlugin plugin={ CesiumIonAuthPlugin } args={ { apiToken: import.meta.env.VITE_ION_KEY, assetId: '2275207', autoRefreshToken: true } } />
 				<TilesPlugin plugin={ GLTFExtensionsPlugin } dracoLoader={ dracoLoader } />
 				<TilesPlugin plugin={ TileCompressionPlugin } />
 				<TilesPlugin plugin={ UpdateOnChangePlugin } />