Skip to content

Commit

Permalink
Merge pull request #18 from spknetwork/feat/onboard-refactor
Browse files Browse the repository at this point in the history 
refactored onboarding
  • Loading branch information
@igormuba
igormuba authored Mar 11, 2024
2 parents f7837a4 + 5efa227 commit 7db575e
Show file tree
Hide file tree
Showing 6 changed files with 250 additions and 71 deletions.
4 changes: 2 additions & 2 deletions src/common/api/breakaway.ts
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import axios, { AxiosResponse } from "axios"
import * as ls from "../util/local-storage";

const baUrl = "http://localhost:4000"
// const baUrl = "https://breakaway-points-system-api.onrender.com"
// const baUrl = "http://localhost:4000"
const baUrl = "https://breakaway-points-system-api.onrender.com"
const accessToken = ls.get("ba_access_token")

export const createBreakawayUser = async (username: string, community: string, referral: string, email: string)=> {
Expand Down
22 changes: 20 additions & 2 deletions src/common/api/operations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1165,7 +1165,6 @@ export const createAccountWithCredit = async (data: any, creator_account: string
};

let tokens: any = await hiveClient.database.getAccounts([creator_account]);
console.log(tokens)
tokens = tokens[0]?.pending_claimed_accounts;

let fee = null;
Expand Down Expand Up @@ -1289,4 +1288,23 @@ export const createAccountWithCredit = async (data: any, creator_account: string
]
],
"Active"
);
);

export const delegateRcKc = async (
delegator: string,
delegatees: string,
max_rc: string | number,
) => {

const json = [
"delegate_rc",
{
"from": delegator,
"delegatees": delegatees.includes(",") ? delegatees.split(",") : [delegatees],
"max_rc": max_rc
}
]

const data = await keychain.customJson(delegator, "rc", "Posting", JSON.stringify(json), "RC Delegated")
return data
};
18 changes: 18 additions & 0 deletions src/common/components/onboard-friend/index.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,21 @@
}
}


@keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}

.blinking-text {
color: rgb(175, 221, 50);
animation: blink 2s infinite;
}

197 changes: 170 additions & 27 deletions src/common/components/onboard-friend/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,12 @@ import ScrollToTop from "../scroll-to-top";
import { _t } from "../../i18n";
import { Global } from "../../store/global/types";
import { Community } from "../../store/communities/types";
import { createHiveAccount, createAccountWithCredit } from "../../api/operations";
import { createHiveAccount, createAccountWithCredit, delegateRcKc, delegateRC } from "../../api/operations";
import { hexDec } from "../../util/b64";
import { ActiveUser } from "../../store/active-user/types";
import { Link } from "react-router-dom";
import { createBreakawayUser } from "../../api/breakaway";
import { getAccounts } from "../../api/hive";
import { delegateRC, formatError } from "../../api/operations";
import { FormControl, InputGroup } from "react-bootstrap";
import { getRcOperationStats } from "../../api/hive";

Expand Down Expand Up @@ -47,12 +46,13 @@ const OnboardFriend = (props: Props | any) => {
const [step, setStep] = useState("confirm");
const [msg, setMsg] = useState("");
const [token, setToken] = useState(0)
const [rcAmount, setRcAmount] = useState(0)
const [isChecked, setChecked] = useState(false);
const [rcAmount, setRcAmount] = useState(5)
const [isChecked, setChecked] = useState(true);
const [commentAmount, setCommentAmount] = useState(0);
const [voteAmount, setVoteAmount] = useState(0);
const [transferAmount, setTransferAmount] = useState(0);
const [customJsonAmount, setCustomJsonAmount] = useState(0);
const [rcError, setRcError] = useState("")

useEffect(() => {
let decodedObj;
Expand All @@ -74,6 +74,12 @@ const OnboardFriend = (props: Props | any) => {
useEffect(() => {
rcOperationsCost();
}, [rcAmount])

useEffect(() => {
if (!isChecked) {
setRcAmount(0);
}
}, [isChecked])

const getAccountTokens = async ()=>{
const acc = await getAccounts([activeUser?.username!]);
Expand All @@ -90,7 +96,7 @@ const OnboardFriend = (props: Props | any) => {
)
if (response.success === true) {
if(isChecked){
delegateRC(activeUser?.username, urlInfo!.username, rcAmount)
await delegateRC(activeUser?.username, urlInfo!.username, rcAmount * 1e9)
}
await createBreakawayUser(urlInfo!.username, props.global.hive_id, urlInfo!.referral, urlInfo!.email)
setStep("success");
Expand All @@ -104,15 +110,67 @@ const OnboardFriend = (props: Props | any) => {
}
}

const createAccountNoUserKcCredit = async () => {
try {
const response: any = await createAccountWithCredit({
username: urlInfo?.username,
keys: urlInfo?.keys
},
urlInfo!.referral
)
if (response.success === true) {
if(isChecked){
await delegateRcKc(urlInfo!.referral, urlInfo!.username, rcAmount * 1e9)
}
await createBreakawayUser(urlInfo!.username, props.global.hive_id, urlInfo!.referral, urlInfo!.email)
setStep("success");
setMsg("Account created successfully")
} else {
setStep("fail")
setMsg("Unable to create account")
}
} catch (error) {

}
}

const createAccount = async ()=> {
try {
const response: any = await createHiveAccount({
username: urlInfo?.username,
keys: urlInfo?.keys
},
activeUser?.username
activeUser?.username || null
);
if (response.success === true) {
if(isChecked){
await delegateRC(urlInfo!.referral, urlInfo!.username, rcAmount * 1e9)
}
await createBreakawayUser(urlInfo!.username, props.global.hive_id, urlInfo!.referral, urlInfo!.email)
setStep("success");
setMsg("Account created successfully")
} else {
setStep("fail")
setMsg("Unable to create acount")
}
} catch (error) {
console.log(error)
};
};

const createAccountNoUser = async ()=> {
try {
const response: any = await createHiveAccount({
username: urlInfo?.username,
keys: urlInfo?.keys
},
urlInfo!.referral
);

if (response.success === true) {
if(isChecked){
await delegateRcKc(urlInfo!.referral, urlInfo!.username, rcAmount * 1e9)
}
await createBreakawayUser(urlInfo!.username, props.global.hive_id, urlInfo!.referral, urlInfo!.email)
setStep("success");
setMsg("Account created successfully")
Expand All @@ -137,16 +195,17 @@ const OnboardFriend = (props: Props | any) => {
const voteCost = operationCosts.vote_operation.avg_cost;
const customJsonOperationsCosts = operationCosts.custom_json_operation.avg_cost;
const createClaimAccountCost = Number(operationCosts.claim_account_operation.avg_cost);
if(Number(rcAmount * 1e9) < 5000000000) {
console.log("too low rc")
setRcError("You can not delegate below 5bn Rc")
} else {
setRcError("")
}

const commentCount: number = Math.ceil(Number(rcAmount) / commentCost);
const votetCount: number = Math.ceil(Number(rcAmount) / voteCost);
const transferCount: number = Math.ceil(Number(rcAmount) / transferCost);
const customJsonCount: number = Math.ceil(Number(rcAmount) / customJsonOperationsCosts);

console.log("commentCount", commentCount)
console.log("votetCount", votetCount )
console.log("transferCount", transferCount)
console.log("customJsonCount", customJsonCount)
const commentCount: number = Math.ceil(Number(rcAmount * 1e9) / commentCost);
const votetCount: number = Math.ceil(Number(rcAmount * 1e9) / voteCost);
const transferCount: number = Math.ceil(Number(rcAmount * 1e9) / transferCost);
const customJsonCount: number = Math.ceil(Number(rcAmount * 1e9) / customJsonOperationsCosts);

setCommentAmount(commentCount);
setVoteAmount(votetCount);
Expand All @@ -171,7 +230,87 @@ const OnboardFriend = (props: Props | any) => {
})
: NavBar({ ...props })}
<div className={`${containerClasses} mt-5`}>
{ !activeUser ? <h3>{_t("onboard.login-warning")}</h3> :
{ !activeUser ? <div>
{<>
<div className="onboard">
{step=== "confirm" && <>
<h5>{_t("onboard.creating-for-a-friend")}</h5>
<div className="friend-details">
{urlInfo && (
<div className="friend-details">
<span>{_t("onboard.username")} {urlInfo.username}</span>
<span>{_t("onboard.public-posting")} {urlInfo.keys.postingPubKey}</span>
<span>{_t("onboard.public-owner")} {urlInfo.keys.ownerPubKey}</span>
<span>{_t("onboard.public-active")} {urlInfo.keys.activePubKey}</span>
<span>{_t("onboard.public-memo")} {urlInfo.keys.memoPubKey}</span>
</div>
)}
</div>

<div className="delegate-rc">
<div className="col-span-12 sm:col-span-10">
<div className="check mb-2">
<input
type="checkbox"
className="checkbox"
checked={isChecked}
onChange={() => {setChecked(!isChecked)}}
/>
<span className="blinking-text">Delegate some resource credits to @{urlInfo!?.username} (Minimum Rc is 5Bn)</span>
</div>
{rcError ? <span className="text-danger mt-3">{rcError}</span> : ""}
{isChecked &&
<div className="mt-3">
<InputGroup>
<FormControl
type="text"
placeholder={"Enter amount to delegate(Bn)"}
value={rcAmount}
onChange={(e: any) => {
setRcAmount(Number(e.target.value))
}}
/>
</InputGroup>
<div className="operation-amount d-flex mt-3">
<span className="operations">Posts/Comment: {commentAmount} |</span>
<span className="operations">Votes: {voteAmount} |</span>
<span className="operations">Transfers: {transferAmount} |</span>
<span className="operations">Reblogs/ Follows: {customJsonAmount}</span>
</div>
</div>
}
</div>
</div>
<div className="create-buttons w-100">
<Button
disabled={rcError !== ""}
onClick={()=> createAccountNoUser()}
className="w-100"
>
Pay with (3Hive)
</Button>
<Button
disabled={token <= 0 || rcError !== ""}
onClick={()=> createAccountNoUserKcCredit()}
className="w-100"
>
Pay with account token
</Button>
</div>
</>}
{step === "success" &&
<>
<h4 className="text-success">{msg}</h4>
<Link to={`/@${urlInfo?.username}`}>Visit @{urlInfo?.username}'s profile</Link>
</>
}
{step === "fail" && <>
<h4 className="text-danger">{msg}</h4>
<Button onClick={()=> setStep("confirm")}>{_t("onboard.try-again")}</Button>
</>}
</div>
</>}
</div> :
<div className="onboard">
{step=== "confirm" && <>
<h5>{_t("onboard.creating-for-a-friend")}</h5>
Expand All @@ -198,19 +337,17 @@ const OnboardFriend = (props: Props | any) => {
setChecked(!isChecked)
}}
/>
<span>Delegate some resource credits to @{urlInfo!?.username} (Minimum Rc is 5Bn)</span>
<span className="blinking-text">Delegate some resource credits to @{urlInfo!?.username} (Minimum Rc is 5Bn)</span>
</div>
{rcError ? <span className="text-danger mt-3">{rcError}</span> : ""}
{isChecked &&
<div className="mt-3">
<InputGroup>
<FormControl
type="text"
placeholder={"Enter amount to delegate(Bn)"}
// value={rcAmount}
onChange={(e: any) => setRcAmount(Number(e.target.value) * 1e9)}
// className={
// Number(amount) > Number(resourceCredit) && amountError ? "is-invalid" : ""
// }
value={rcAmount}
onChange={(e: any) => setRcAmount(Number(e.target.value))}
/>
</InputGroup>
<div className="operation-amount d-flex mt-3">
Expand All @@ -225,11 +362,17 @@ const OnboardFriend = (props: Props | any) => {
</div>

<div className="create-buttons w-100">
<Button onClick={()=> createAccount()} className="w-100">Pay with (3Hive)</Button>
<Button
disabled={rcError !== ""}
onClick={()=> createAccount()}
className="w-100"
>
Pay with (3Hive)
</Button>
<Button
disabled={token <= 0}
onClick={()=> accountWithCredit()}
className="w-100"
disabled={token <= 0 || rcError !== ""}
onClick={()=> accountWithCredit()}
className="w-100"
>
Pay with account token
</Button>
Expand All @@ -251,4 +394,4 @@ const OnboardFriend = (props: Props | any) => {
);
}

export default connect(pageMapStateToProps, pageMapDispatchToProps)(OnboardFriend);
export default connect(pageMapStateToProps, pageMapDispatchToProps)(OnboardFriend);
9 changes: 8 additions & 1 deletion src/common/helper/keychain.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,14 @@ export const transfer = (account: string, to: string, amount: string, memo: stri
})


export const customJson = (account: string, id: string, key: AuthorityTypes, json: string, display_msg: string, rpc: string | null = null): Promise<TxResponse> =>
export const customJson = (
account: string,
id: string,
key: AuthorityTypes,
json: string,
display_msg: string,
rpc: string | null = null
): Promise<TxResponse> =>
new Promise<TxResponse>((resolve, reject) => {
window.hive_keychain?.requestCustomJson(account, id, key, json, display_msg, (resp) => {
if (!resp.success) {
Expand Down
Loading

0 comments on commit 7db575e

Please sign in to comment.