Skip to content

Commit

Permalink
added linking
Browse files Browse the repository at this point in the history
  • Loading branch information
joel-medicala-yral committed Dec 24, 2024
1 parent fff2929 commit 9d01ab3
Show file tree
Hide file tree
Showing 2 changed files with 95 additions and 37 deletions.
71 changes: 52 additions & 19 deletions ssr/src/page/icpump/mod.rs
Original file line number Diff line number Diff line change
Expand Up @@ -208,16 +208,18 @@ pub fn TokenCard(
) -> impl IntoView {
let show_nsfw = create_rw_signal(false);

let popup = create_rw_signal(false);
let base_url = get_host();

let share_link_s = store_value(format!("{}/{}", details.link, details.user_id));
let share_message = format!(
let share_link = create_rw_signal("".to_string());
let share_link_coin = format!("/token/info/{}/{}", root, details.user_id);
let symbol = details.token_symbol.clone();
let share_message = move || {
format!(
"Hey! Check out the token: {} I created on YRAL 👇 {}. I just minted my own token—come see and create yours! 🚀 #YRAL #TokenMinter",
details.token_symbol,
share_link_s(),
);
let share_message_s = store_value(share_message);
details.token_symbol.clone(),
share_link.get(),
)
};
let pop_up = create_rw_signal(false);
let base_url = get_host();

view! {
<div
Expand Down Expand Up @@ -250,7 +252,7 @@ pub fn TokenCard(
<div class="flex flex-col gap-2">
<div class="flex gap-4 justify-between items-center w-full text-lg">
<span class="font-medium shrink line-clamp-1">{details.name}</span>
<span class="font-bold shrink-0">{details.token_symbol}</span>
<span class="font-bold shrink-0">{symbol}</span>
</div>
<span class="text-sm line-clamp-2 text-neutral-400">
{details.description}
Expand All @@ -270,22 +272,35 @@ pub fn TokenCard(
<ActionButton label="Buy/Sell".to_string() href="#".to_string() disabled=true>
<Icon class="w-full h-full" icon=ArrowLeftRightIcon />
</ActionButton>
<ActionButton label="Airdrop".to_string() href=format!("/token/info/{root}/{}?airdrop_amt=100", details.user_id) disabled=is_airdrop_claimed>
<Icon class="w-full h-full" icon=AirdropIcon />
</ActionButton>
{
if is_airdrop_claimed{

view! {
<ActionButtonLink on:click=move |_|{pop_up.set(true); share_link.set(format!("/token/info/{}/{}?airdrop_amt=100",root, details.user_id))} label="Airdrop".to_string()>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButtonLink>
}
}else{
view! {
<ActionButton href=format!("/token/info/{}/{}?airdrop_amt=100",root, details.user_id) label="Airdrop".to_string()>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButton>
}
}
}
<ActionButton label="Share".to_string() href="#".to_string()>
<Icon class="w-full h-full" icon=ShareIcon on:click=move |_| popup.set(true)/>
<Icon class="w-full h-full" icon=ShareIcon on:click=move |_| {pop_up.set(true); share_link.set(share_link_coin.clone())}/>
</ActionButton>
<ActionButton label="Details".to_string() href=details.link>
<Icon class="w-full h-full" icon=ChevronRightIcon />
</ActionButton>
</div>
<PopupOverlay show=popup >
<PopupOverlay show=pop_up >
<ShareContent
share_link=format!("{base_url}{}", share_link_s())
message=share_message_s()
show_popup=popup
/>
share_link=format!("{base_url}{}", share_link())
message=share_message()
show_popup=pop_up
/>
</PopupOverlay>
</div>
}
Expand Down Expand Up @@ -338,6 +353,24 @@ pub fn ActionButton(
}
}

#[component]
pub fn ActionButtonLink(
label: String,
children: Children,
#[prop(optional, default = false)] disabled: bool,
) -> impl IntoView {
view! {
<button
disabled=disabled
class=move || format!("flex flex-col gap-1 justify-center items-center text-xs transition-colors {}", if !disabled{"group-hover:text-white text-neutral-300"}else{"group-hover:cursor-default text-neutral-600"})
>
<div class="w-[1.875rem] h-[1.875rem] flex items-center justify-center">{children()}</div>

<div>{label}</div>
</button>
}
}

#[component]
pub fn TelegramIcon(href: String, classes: String) -> impl IntoView {
view! {
Expand Down
61 changes: 43 additions & 18 deletions ssr/src/page/wallet/tokens.rs
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ use crate::component::icons::{
};
use crate::component::overlay::PopupOverlay;
use crate::component::share_popup::ShareContent;
use crate::page::icpump::ActionButton;
use crate::page::icpump::{ActionButton, ActionButtonLink};
use crate::state::canisters::authenticated_canisters;
use crate::utils::host::get_host;
use crate::utils::token::icpump::IcpumpTokenInfo;
Expand Down Expand Up @@ -69,12 +69,12 @@ pub fn TokenView(
}
}

fn generate_share_link_from_metadata(
pub fn generate_share_link_from_metadata(
token_meta_data: &TokenMetadata,
user_principal: Principal,
) -> String {
format!(
"/token/info/{}/{user_principal}?airdrop_amt=100",
"/token/info/{}/{user_principal}",
token_meta_data
.root
.map(|r| r.to_text())
Expand Down Expand Up @@ -124,17 +124,18 @@ pub fn WalletCard(
.map(|r| r.to_text())
.unwrap_or(token_meta_data.name.to_lowercase());

let share_link = generate_share_link_from_metadata(&token_meta_data, user_principal);
let share_link_s = store_value(share_link);
let share_message = format!(
let share_link = create_rw_signal("".to_string());
let share_link_coin = generate_share_link_from_metadata(&token_meta_data, user_principal);
let symbol = token_meta_data.symbol.clone();
let share_message = move || {
format!(
"Hey! Check out the token: {} I created on YRAL 👇 {}. I just minted my own token—come see and create yours! 🚀 #YRAL #TokenMinter",
token_meta_data.symbol,
share_link_s(),
);
let share_message_s = store_value(share_message);
token_meta_data.symbol.clone(),
share_link.get(),
)
};
let pop_up = create_rw_signal(false);
let base_url = get_host();

view! {
<div class="flex flex-col gap-4 bg-neutral-900/90 rounded-lg w-full p-4 font-kumbh text-white">
<div class="w-full flex items-center justify-between p-3 rounded-[4px] bg-neutral-800/70">
Expand All @@ -148,7 +149,7 @@ pub fn WalletCard(
</div>
<div class="flex flex-col items-end">
<div class="text-lg font-medium">{token_meta_data.balance.unwrap().humanize_float_truncate_to_dp(2)}</div>
<div class="text-xs">{token_meta_data.symbol}</div>
<div class="text-xs">{symbol}</div>
</div>
</div>
<div class="flex items-center justify-around">
Expand All @@ -158,11 +159,35 @@ pub fn WalletCard(
<ActionButton disabled=true href="#".to_string() label="Buy/Sell".to_string()>
<Icon class="h-6 w-6" icon=ArrowLeftRightIcon />
</ActionButton>
<ActionButton disabled=is_airdrop_claimed href=token_meta_data.token_owner.map(|token_owner| format!("/token/info/{root}/{}?airdrop_amt=100", token_owner.principal_id)).unwrap_or_default() label="Airdrop".to_string()>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButton>
{
match token_meta_data.token_owner{
Some(token_owner) => {
if is_airdrop_claimed{
let root = root.clone();
view! {
<ActionButtonLink on:click=move |_|{pop_up.set(true); share_link.set(format!("/token/info/{}/{}?airdrop_amt=100",root, token_owner.principal_id))} label="Airdrop".to_string()>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButtonLink>
}
}else{
view! {
<ActionButton href=format!("/token/info/{}/{}?airdrop_amt=100",root, token_owner.principal_id) label="Airdrop".to_string()>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButton>
}
}
},
None => {
view! {
<ActionButton href="#".to_string() label="Airdrop".to_string() disabled=true>
<Icon class="h-6 w-6" icon=AirdropIcon />
</ActionButton>
}
}
}
}
<ActionButton href="#".to_string() label="Share".to_string()>
<Icon class="h-6 w-6" icon=ShareIcon on:click=move |_| pop_up.set(true) />
<Icon class="h-6 w-6" icon=ShareIcon on:click=move |_| {pop_up.set(true); share_link.set(share_link_coin.clone())}/>
</ActionButton>
<ActionButton href=format!("/token/info/{root}/{user_principal}") label="Details".to_string()>
<Icon class="h-6 w-6" icon=ChevronRightIcon />
Expand All @@ -171,8 +196,8 @@ pub fn WalletCard(

<PopupOverlay show=pop_up >
<ShareContent
share_link=format!("{base_url}{}", share_link_s())
message=share_message_s()
share_link=format!("{base_url}{}", share_link())
message=share_message()
show_popup=pop_up
/>
</PopupOverlay>
Expand Down

0 comments on commit 9d01ab3

Please sign in to comment.