//tips
//smart contract
Followボタンの作成とfollowイベントの組み込みを行う。
Followerなどの記載に続けてボタンを設置する。
Spaceタグの間にスペースを設けるために を追加。これにより半角スペースが挿入される。
<Button variant="contained">+ FOLLOW</Button>
variant="outlined”に変更してより見やすく変更。
ボタンをクリックすると、クリック先のuserid保持者の先のarrayの中に、クリックした人のユーザ情報(auth.mail、user.displayName)を取り、それを格納する。
前提としてauthで取得するのものはデータベースに登録された情報と同じであり、uniqueなものであるということ。これは、データベースでの変更処理とauthの変更処理を同じくしているという前提の上で成り立つ。editにてusername,emailが変更された場合、authにも連動して反映させる仕組みを追加する。
後で自身のフォローはできないようにするが一旦こちらでuser.displayNameを[id]に該当するuseridを持つユーザーのfollowersのarrayの中に組み込む方法を考える。
onClick={()=>console.log(auth.currentUser.displayName)}はnullとなった。authの登録時にusernameを登録させていなかったためだった。mailのみをデータベースとの共通条件としているので、authhistoryに格納させたmailでの共有作業を行うことにする。
[id]でもAuthhistoryの設定を行う必要があるか。
あまり行うことはないかと思うが、Editページから仕組みを作っていく。authhistoryを受け取ったら、そのmailアドレスとusernameを持つドキュメントを探して、usernameを取得。
そのusernameを、現在のページのninja[0].useridのarrayを持つドキュメントを探した後、そのfollowerに追加する必要がある。
現在のデータベースにあるuseridの登録は手作業で行なっているので、新規登録時にuseridの最後尾を取得し+1することで、新規登録したタイミングで一緒にuseridも生成される仕組みにする必要がある。
まずは主要な変数にアクセスできているかを確認。
async function handleOnArrayfollow(e) {
console.log(authhistory)
console.log(ninja[0].userid)
}
問題なく取得できた。
async function handleOnArrayfollow(e) {
console.log(authhistory)
console.log(ninja[0].userid)
const colRef= await collection(firebaseApp, "mydata")
const q = await query(colRef,where("mail","==",authhistory))
var getmyuserid=""
var getmyusername=""
var getdocid=""
var getfollowing=""
//authをもとにクリック主のデータベース情報の取得
await getDocs(q)
.then((snapshot)=>{
snapshot.docs.forEach(doc => {
const data = doc.data()
if(data.userid&&data.mail&&data.following)
{
getmyuserid=data.userid
getmyusername=data.mail
getdocid = doc.id
getfollowing = data.following
console.log(getmyuserid)
console.log(getmyusername)
console.log(getdocid)
console.log(getfollowing)
}
});
}).then(()=>{
//自身のデータベースのfollowingにクリック先の[id]情報を登録
const profileRef=doc(firebaseApp,'mydata',getdocid)
updateDoc(profileRef, {
following: arrayUnion(ninja[0].username)
})
}).then(()=>{
//クリック主の情報をクリックされた側のデータベースのfollowersを含むドキュメントを取得
ninja.forEach(Item => {
})
まだ組みかけ。
