feat: use zustand manage credentials globally
This commit is contained in:
parent
dde32df979
commit
d063c69172
|
@ -21,6 +21,7 @@ export default function RootLayout() {
|
|||
<ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
|
||||
<Stack>
|
||||
<Stack.Screen name="login" options={{ title: "Login" }} />
|
||||
<Stack.Screen name="feed_list" options={{title: "Feed List"}} />
|
||||
<Stack.Screen name="+not-found" />
|
||||
</Stack>
|
||||
<StatusBar style="auto" />
|
||||
|
|
8
app/feed_list.tsx
Normal file
8
app/feed_list.tsx
Normal file
|
@ -0,0 +1,8 @@
|
|||
import { View } from 'react-native'
|
||||
|
||||
export default function FeedListView() {
|
||||
return (
|
||||
<View>
|
||||
</View>
|
||||
)
|
||||
}
|
|
@ -1,21 +1,20 @@
|
|||
import { TextInput, View, StyleSheet, Button } from 'react-native'
|
||||
import { useState } from 'react'
|
||||
import axios from 'axios'
|
||||
import { useRouter } from 'expo-router'
|
||||
import { useAuthStore } from '../store'
|
||||
|
||||
export default function LoginView() {
|
||||
const [username, setUsername] = useState('')
|
||||
const [password, setPassword] = useState('')
|
||||
const router = useRouter()
|
||||
const { verify } = useAuthStore()
|
||||
|
||||
async function login() {
|
||||
console.log(username, password)
|
||||
try {
|
||||
const res = await axios.get("https://api.feedbin.com/v2/authentication.json", {
|
||||
auth: {
|
||||
username,
|
||||
password
|
||||
}
|
||||
})
|
||||
console.log(res.status)
|
||||
const res = await verify(username, password)
|
||||
if (!res) return
|
||||
// Navigate to feed list on successful login
|
||||
router.push('/feed_list')
|
||||
} catch(e) {
|
||||
console.log("error on verifing your credentials")
|
||||
console.log(e)
|
||||
|
|
32
package-lock.json
generated
32
package-lock.json
generated
|
@ -34,7 +34,8 @@
|
|||
"react-native-safe-area-context": "5.4.0",
|
||||
"react-native-screens": "~4.11.1",
|
||||
"react-native-web": "~0.20.0",
|
||||
"react-native-webview": "13.13.5"
|
||||
"react-native-webview": "13.13.5",
|
||||
"zustand": "^5.0.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.25.2",
|
||||
|
@ -12938,6 +12939,35 @@
|
|||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/zustand": {
|
||||
"version": "5.0.6",
|
||||
"resolved": "https://registry.npmjs.org/zustand/-/zustand-5.0.6.tgz",
|
||||
"integrity": "sha512-ihAqNeUVhe0MAD+X8M5UzqyZ9k3FFZLBTtqo6JLPwV53cbRB/mJwBI0PxcIgqhBBHlEs8G45OTDTMq3gNcLq3A==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@types/react": ">=18.0.0",
|
||||
"immer": ">=9.0.6",
|
||||
"react": ">=18.0.0",
|
||||
"use-sync-external-store": ">=1.2.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@types/react": {
|
||||
"optional": true
|
||||
},
|
||||
"immer": {
|
||||
"optional": true
|
||||
},
|
||||
"react": {
|
||||
"optional": true
|
||||
},
|
||||
"use-sync-external-store": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -37,7 +37,8 @@
|
|||
"react-native-safe-area-context": "5.4.0",
|
||||
"react-native-screens": "~4.11.1",
|
||||
"react-native-web": "~0.20.0",
|
||||
"react-native-webview": "13.13.5"
|
||||
"react-native-webview": "13.13.5",
|
||||
"zustand": "^5.0.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.25.2",
|
||||
|
|
3
store/index.ts
Normal file
3
store/index.ts
Normal file
|
@ -0,0 +1,3 @@
|
|||
import useAuthStore from './useAuthStore'
|
||||
|
||||
export { useAuthStore }
|
32
store/useAuthStore.ts
Normal file
32
store/useAuthStore.ts
Normal file
|
@ -0,0 +1,32 @@
|
|||
import { create } from 'zustand'
|
||||
import axios from 'axios'
|
||||
|
||||
type AuthState = {
|
||||
credential?: {
|
||||
username: string,
|
||||
password: string
|
||||
};
|
||||
verify: (username: string, password: string) => Promise<boolean>
|
||||
}
|
||||
|
||||
export default create<AuthState>(set => ({
|
||||
verify: async (username: string, password: string): Promise<boolean> => {
|
||||
try {
|
||||
const res = await axios.get("https://api.feedbin.com/v2/authentication.json", {
|
||||
auth: { username, password }
|
||||
})
|
||||
|
||||
console.log("verifying")
|
||||
|
||||
if (res.status > 299) return false
|
||||
|
||||
set({
|
||||
credential: { username, password }
|
||||
})
|
||||
return true
|
||||
} catch(e) {
|
||||
console.log(e)
|
||||
return false
|
||||
}
|
||||
}
|
||||
}))
|
Loading…
Reference in New Issue
Block a user