@@ -3,12 +3,14 @@ import { db } from '../config/firebase'
3
3
import { app_context_type , AppContext } from '../App'
4
4
import { getDocs , addDoc , collection } from 'firebase/firestore'
5
5
import { useForm , FieldValues } from 'react-hook-form'
6
+ import { useNavigate } from 'react-router-dom'
6
7
7
8
interface i_post_data {
8
9
uid : string ;
9
10
pid : string ;
10
11
post : string ;
11
12
user : string ;
13
+ likes : number ;
12
14
}
13
15
14
16
const Home = ( ) => {
@@ -17,9 +19,6 @@ const Home = () => {
17
19
const [ posts_state , set_posts_state ] = useState < i_post_data [ ] | null > ( null ) ;
18
20
const [ made_post , set_made_post ] = useState ( '' ) ;
19
21
20
- const posts = collection ( db , 'posts' ) ;
21
- const likes = collection ( db , 'likes' ) ;
22
-
23
22
/*
24
23
const do_db = () => {
25
24
const docs = getDocs(posts);
@@ -59,18 +58,25 @@ const Home = () => {
59
58
return `${curr_uid}${built_pid}`;
60
59
}
61
60
*/
61
+ const nav = useNavigate ( ) ;
62
62
const handle_click = async ( data : FieldValues ) => {
63
- await addDoc ( posts , {
64
- uid : user ?. uid ,
65
- pid : user ?. uid ,
66
- post : data ?. post ,
67
- user : user ?. displayName ,
68
- } ) ;
69
-
70
- set_made_post ( data ?. post ) ;
63
+ if ( ! user ) {
64
+ nav ( '/login' ) ;
65
+ } else {
66
+ const posts = collection ( db , 'posts' ) ;
67
+ await addDoc ( posts , {
68
+ uid : user ?. uid ,
69
+ pid : user ?. uid ,
70
+ post : data ?. post ,
71
+ user : user ?. displayName ,
72
+ } ) ;
73
+
74
+ set_made_post ( data ?. post ) ;
75
+ }
71
76
} ;
72
77
73
78
const handle_like = ( pid : string ) => {
79
+ const likes = collection ( db , 'likes' ) ;
74
80
addDoc ( likes , {
75
81
user_id : user ?. uid ,
76
82
post_id : pid ,
@@ -79,24 +85,39 @@ const Home = () => {
79
85
80
86
const { register, handleSubmit } = useForm ( { } ) ;
81
87
82
-
83
88
useEffect ( ( ) => {
84
- //set_posts_state(null); //take this out so it doesn't visbly refresh
85
- //do_db();
89
+ const likes = collection ( db , 'likes' ) ;
90
+ const get_like_cnt = async ( tmp_pid : string ) : Promise < number > => {
91
+ let cnt = 0 ;
92
+
93
+ const likes_docs = await getDocs ( likes ) ;
94
+ likes_docs . docs . forEach ( ( value ) => {
95
+ if ( value . get ( 'post_id' ) === tmp_pid ) {
96
+ //console.log('it hit');
97
+ cnt ++ ;
98
+ }
99
+ } ) ;
100
+
101
+ return cnt
102
+ } ;
86
103
104
+ const posts = collection ( db , 'posts' ) ;
105
+ console . log ( 'IS READING!' ) ;
87
106
const docs = getDocs ( posts ) ;
88
107
89
108
const holder : i_post_data [ ] = [ ] ;
90
109
docs . then ( ( data ) => {
91
110
data . docs . forEach ( ( val ) => {
92
- holder . push ( { post : val . get ( 'post' ) , user : val . get ( 'user' ) , uid : val . get ( 'uid' ) , pid : val . get ( 'pid' ) } ) ;
93
- } ) ;
111
+ const tmp_pid = val . get ( 'pid' ) ;
112
+ get_like_cnt ( tmp_pid ) . then ( ( cnt ) => {
113
+ holder . push ( { post : val . get ( 'post' ) , user : val . get ( 'user' ) , uid : val . get ( 'uid' ) , pid : val . get ( 'pid' ) , likes : cnt } ) ;
114
+ set_posts_state ( holder ) ;
115
+ } ) ;
116
+ } ) ;
94
117
} ) . catch ( ( err ) => {
95
118
console . log ( err ) ;
96
- } ) . finally ( ( ) => {
97
- set_posts_state ( holder ) ;
98
- } ) ;
99
- } , [ made_post , posts ] ) ;
119
+ } )
120
+ } , [ made_post ] ) ;
100
121
101
122
return (
102
123
< >
@@ -114,7 +135,7 @@ const Home = () => {
114
135
< div className = "post-block" key = { Math . random ( ) } >
115
136
< h3 className = "post-user" > @{ val . user } </ h3 >
116
137
< p className = "post-date" > (11/04/23)</ p >
117
- < button onClick = { ( ) => handle_like ( val . pid ) } className = "post-like-btn" > 🔥</ button >
138
+ < button onClick = { ( ) => handle_like ( val . pid ) } className = "post-like-btn" > 🔥{ val . likes } </ button >
118
139
< button className = "post-dislike-btn" > 💩</ button >
119
140
< p key = { Math . random ( ) } className = "post-text" > { val . post } </ p >
120
141
@@ -154,11 +175,12 @@ const Home = () => {
154
175
155
176
< div className = "post-form-container" >
156
177
< form onSubmit = { handleSubmit ( handle_click ) } >
157
- < input className = "post-form-input" type = "text" placeholder = "What's on your mind?" { ...register ( 'post' ) } />
178
+ < input className = "post-form-input" type = "text" placeholder = "What's on your mind?" { ...register ( 'post' ) } onKeyDown = { ( e ) => {
179
+ if ( e . key === 'Enter' )
180
+ e . currentTarget . value = '' ;
181
+ } } />
158
182
< button className = "post-form-submit" type = "submit" > post</ button >
159
183
</ form >
160
-
161
-
162
184
</ div >
163
185
</ >
164
186
)
0 commit comments