Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[TAS-458] ✨ Add more NFT Books page #1339

Merged
merged 10 commits into from
Oct 4, 2023
Merged

[TAS-458] ✨ Add more NFT Books page #1339

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
df82e58
🚚 Move store page folder structure
nwingt Sep 26, 2023
f4ead42
✨ Add more NFT Books page
nwingt Sep 26, 2023
93d65bb
✨ Show author if exists for NFT Book
nwingt Sep 26, 2023
86db6c5
👔 List all NFT Books in des order of published date
nwingt Sep 29, 2023
95a11b4
✨ Dynamically show just arrived label
nwingt Sep 29, 2023
10f2852
🔀 Merge develop updates
nwingt Sep 29, 2023
4e6c82b
🎨 Rename iscnAuthor to iscnWorkAuthor
nwingt Sep 29, 2023
0d354d8
👔 List hkcourtnews
nwingt Sep 29, 2023
a379eca
🎨 Reorder NFT Book listing
nwingt Sep 29, 2023
ea01f42
🔀 Merge develop updates
nwingt Sep 29, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
106 changes: 63 additions & 43 deletions src/components/NFTBook/ItemCard.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@
<Label
class="text-medium-gray mt-[6px] mb-[12px]"
preset="p6"
:text="creatorDisplayName | ellipsis"
:text="(iscnWorkAuthor || creatorDisplayName) | ellipsis"
/>
<Label
v-if="nftBookAvailablePriceLabel"
Expand Down Expand Up @@ -113,6 +113,7 @@
<!-- Info column -->
<div class="flex flex-col items-center laptop:items-start justify-start py-[32px] gap-[12px] grow">
<Label
v-if="isNew"
class="text-like-cyan"
:text="$t('campaign_nft_book_just_arrived')"
/>
Expand All @@ -124,41 +125,51 @@
descriptionStyle
]"
>{{ NFTDescription }}</p>
<div class="flex">
<ul class="flex flex-wrap mt-[12px] gap-[1.5rem]">
<li v-if="iscnWorkAuthor" class="flex flex-col justify-center ml-[8px]">
<span
class="text-like-cyan-gray text-10"
>{{ $t('identity_type_author') }}</span>
<span
:class="['font-[600]', displayNameStyle]"
>{{ iscnWorkAuthor | ellipsis }}</span>
</li>
<client-only>
<NuxtLink
class="mt-[12px] flex items-center text-like-green group my-[8px]"
:to="
iscnOwner
? localeLocation({
name: 'id',
params: { id: iscnOwner },
query: { tab: 'created' },
})
: ''"
@click.native.stop="onClickAvatar"
>
<Identity
:avatar-url="creatorAvatar"
:avatar-size="42"
:is-avatar-disabled="true"
:is-lazy-loaded="true"
/>
<div class="flex flex-col justify-start ml-[8px]">
<span class="text-like-cyan-gray text-10 group-hover:underline">{{
$t('identity_type_creator')
}}</span>
<span
:class="[
'group-hover:underline',
'font-[600]',
displayNameStyle,
]"
>{{ creatorDisplayName | ellipsis }}</span>
</div>
</NuxtLink>
<li>
<NuxtLink
class="flex items-center text-like-green group my-[8px]"
:to="
iscnOwner
? localeLocation({
name: 'id',
params: { id: iscnOwner },
query: { tab: 'created' },
})
: ''"
@click.native.stop="onClickAvatar"
>
<Identity
:avatar-url="creatorAvatar"
:avatar-size="42"
:is-avatar-disabled="true"
:is-lazy-loaded="true"
/>
<div class="flex flex-col justify-start ml-[8px]">
<span
class="text-like-cyan-gray text-10 group-hover:underline"
>{{ $t(iscnWorkAuthor ? 'identity_type_publisher' : 'identity_type_creator') }}</span>
<span
:class="[
'group-hover:underline',
'font-[600]',
displayNameStyle,
]"
>{{ creatorDisplayName | ellipsis }}</span>
</div>
</NuxtLink>
</li>
</client-only>
</div>
</ul>

<slot name="column-right" />

Expand Down Expand Up @@ -244,6 +255,13 @@ export default {
isDetailsPreset() {
return this.preset === PRESET_TYPE.DETAILS;
},
isNew() {
// True if within 30 days
return (
new Date().getTime() - new Date(this.iscnData?.recordTimestamp) <
1000 * 60 * 60 * 24 * 30
);
},
contentTypes() {
const types = [];
this.iscnContentUrls.forEach(url => {
Expand Down Expand Up @@ -304,16 +322,18 @@ export default {
methods: {
async fetchInfo() {
await this.lazyFetchNFTClassAggregatedData();
if (this.preset === PRESET_TYPE.DETAILS) {
return;
}

try {
if ([PRESET_TYPE.CAMPAIGN, PRESET_TYPE.SHELF].includes(this.preset)) {
await this.fetchNFTBookPriceByClassId(this.classId).catch(error => {
if (error.response?.status !== 400) {
throw error;
} else {
return Promise.resolve();
}
});
}
await this.fetchNFTBookPriceByClassId(this.classId).catch(error => {
if (error.response?.status !== 400) {
throw error;
} else {
return Promise.resolve();
}
});
} catch (error) {
if (!error.response?.status === 404) {
// eslint-disable-next-line no-console
Expand Down
9 changes: 9 additions & 0 deletions src/components/NFTPage/PreviewCard.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,11 @@
displayName | ellipsis
}}</Label>
</NuxtLink>

<div v-if="iscnWorkAuthor" class="my-[1rem] flex flex-col items-center text-center">
<span class="text-like-cyan-gray text-10">{{ $t('identity_type_author') }}</span>
<span class="text-dark-gray">{{ iscnWorkAuthor | ellipsis }}</span>
</div>
</div>
<Label
class="mt-[12px]"
Expand Down Expand Up @@ -165,6 +170,10 @@ export default {
type: String,
default: undefined,
},
iscnWorkAuthor: {
type: String,
default: undefined,
},
iscnUrl: {
type: String,
default: undefined,
Expand Down
166 changes: 155 additions & 11 deletions src/constant/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,26 +82,170 @@ export const LIKECOIN_NFT_CLASS_FREE_MINT = IS_TESTNET
? 'likenft1t2a7n9px9y5mhayjpk4s7m40zwjr3wvyg4ucg32w77jxmsw7889qg6ky8d'
: 'likenft1wtq5cqjw9vhpjqq6g8l55jhez6dpn78nxmna4dz235wrlwa203qs7j234q';

export const LIKECOIN_NFT_BOOK_ITEMS = IS_TESTNET
export const LIKECOIN_NFT_BOOK_INDEX_FEATURED_ITEMS = IS_TESTNET
? ['likenft17425skd9dfq8djm9j6c73vv2393ffaq9gpes6ewq77x2mgp4w2xqp7vkla']
: [
// 天工開物・栩栩如真
'likenft19symzw3xmh42gukzts858wf6rsdkn6e4jtc9wp8jh4kphfmffy5s6acyxg',
];

export const LIKECOIN_NFT_BOOK_FEATURED_ITEMS = IS_TESTNET
? [
'likenft1fsf4x0tsm8gj8x0adkcce68es2xt5gwk9y7zjf06wwh92t27s99q3ktwpn',
'likenft1xj9jkxcernd2fzd6597tee3v57hzy8r4tzpmr7hu5mqvzah7ztaqua9yvh',
'likenft1yycuh6458s9045xvy6205xp2uhpl7r4lukfdclhg0phwjlfytq3skmuq8j',
'likenft1j3azrgn736esh3sm0y03l93pecmy8mkuf43n0w3j22zeqn3r6uwsz40spa',
{
classId:
'likenft1dgvyx97wv5f3kz3ag9uk0u2t4rwd6azth9yxre7ux2pwz6f75ytstfktxm',
date: '2023-09-26T14:10:25',
},
{
classId:
'likenft17425skd9dfq8djm9j6c73vv2393ffaq9gpes6ewq77x2mgp4w2xqp7vkla',
date: '2023-09-26T14:12:35',
},
{
classId:
'likenft15raex2xg55l0vutfww8faxnsjxxeqead87mtaj7tczzvmpgxmn3s95vnp2',
date: '2023-09-26T14:13:24',
},
{
classId:
'likenft1cstgwjga3295rnp7rukqwschu7c9zka99x0lm2xwphx3aksqmp7s38d3v4',
date: '2023-09-26T14:14:25',
},
{
classId:
'likenft1h5td83etzwrrqvjnedwh800nkfzcnc3773l3pzupegcvyug749dslxgn5m',
date: '2023-09-26T14:15:38',
},
]
: [
// 庭刊試刊號
{
classId:
'likenft1uqslq83ghnr0nc5e7rq7dkyw5cfxwhnqj2ny8z93l52ap4c2jrqqsh4jng',
date: '2023-09-24T01:16:43',
},
// 天工開物・栩栩如真
'likenft19symzw3xmh42gukzts858wf6rsdkn6e4jtc9wp8jh4kphfmffy5s6acyxg',
{
classId:
'likenft19symzw3xmh42gukzts858wf6rsdkn6e4jtc9wp8jh4kphfmffy5s6acyxg',
date: '2023-04-22T11:20:35',
},
// 試酸號《當不再有愛 友愛就不復存》
'likenft1r5me9g3kln40mfgufmcnkn5hhl8tuucjtkgtf7xfcf57nmd4985q2dau37',
{
classId:
'likenft1r5me9g3kln40mfgufmcnkn5hhl8tuucjtkgtf7xfcf57nmd4985q2dau37',
date: '2023-08-12T07:48:19',
},
// 從新浪潮到新本土：48部電影裡的香港城誌
'likenft15ayw5nv7yxrlv6vvrxk0fvwdzsweqqyyw6we50dq2zaq2rk60pcs6ufhd7',
{
classId:
'likenft15ayw5nv7yxrlv6vvrxk0fvwdzsweqqyyw6we50dq2zaq2rk60pcs6ufhd7',
date: '2023-07-14T13:12:52',
},
// 崩潰與重建：ChatGPT衝擊下的人類未來
'likenft1rax0ns09sr80yz8q6x9t8tp7khaedut5j0pnjjzlcjwtl78686cqprmu2x',
{
classId:
'likenft1rax0ns09sr80yz8q6x9t8tp7khaedut5j0pnjjzlcjwtl78686cqprmu2x',
date: '2023-04-21T03:12:16',
},
// Craft Your World
'likenft1uxjuhufvem4ccvwmquvt0uecfgcnn7wqpasyctn3glsq3q7kpxusnk7jaf',
{
classId:
'likenft1uxjuhufvem4ccvwmquvt0uecfgcnn7wqpasyctn3glsq3q7kpxusnk7jaf',
date: '2023-04-14T17:45:17',
},
// 所謂「我不投資」，就是 all in 在法定貨幣
'likenft1ku4ra0e7dgknhd0wckrkxspuultynl4mgkxa3j08xeshfr2l0ujqmmvy83',
{
classId:
'likenft1ku4ra0e7dgknhd0wckrkxspuultynl4mgkxa3j08xeshfr2l0ujqmmvy83',
date: '2022-12-05T05:00:56',
},
// 啼笑因緣
{
classId:
'likenft12ukk5nakcfxzh58vtdx7e2keun050247n8pnsfqsypgdhkq94dpste7uqw',
date: '2023-09-27T17:13:34',
},
// 沉淪
{
classId:
'likenft1cjf56z3dju27dv77hqxdpm3e034gluq3etmagxygssexr86sem6sk3szyq',
date: '2023-09-24T13:31:01',
},
// 吶喊
{
classId:
'likenft1v0y53j55l96ye4dzm00gqfhkazzy6mrytlav4cy35stthvflk9ls7fpqhs',
date: '2023-09-24T13:37:51',
},
];

export const LIKECOIN_NFT_BOOK_ITEMS = IS_TESTNET
? [
{
classId:
'likenft10rur203yk5mc7ufx0r56ssj5q7656upwfp56sccxm7hut0nft2gq9k70wv',
date: '2023-09-26T06:40:40',
},
{
classId:
'likenft1yuqkfvv9zsju94paak03sqn28rn5vrnfad3kuercenpuh3eax06qcug578',
date: '2023-09-26T06:50:45',
},
{
classId:
'likenft1pvzffhcdk5yn6sh4hju7h0k56mrd30j8nd39pemw0u4qnxzg3ynsfkhg0d',
date: '2023-09-26T14:07:34',
},
{
classId:
'likenft1kramesxthl5f09pf5elrejvml9zufmtn9cuf74r5zmwhlf866udq5d5x25',
date: '2023-09-26T14:09:24',
},
]
: [
// 呼蘭河傳
{
classId:
'likenft1hfx5j4utxp9mpdzf5g5r7w9gve4lw9q2a402k00t45ruf8pca2eqndap32',
date: '2023-09-24T13:32:48',
},
// Brave New World
{
classId:
'likenft16744dyfn96vswqsy6286hzatnymzg0vwnr6aqrpwm9d7hpfnh7rqmktxua',
date: '2023-09-24T13:34:05',
},
// Animal Farm
{
classId:
'likenft14tuskytm0ewn4aadxrmlfgszexppk0f5xef2xu7zhjltdz3eud9s743mrj',
date: '2023-09-24T13:37:03',
},
// Oliver Twist
{
classId:
'likenft1yulzjeeuz4fdj754tugqw6342dyfd5wtkfyraly45ea79h9qnjxs8cqxfe',
date: '2023-09-24T13:38:32',
},
// The Count of Monte Christo
{
classId:
'likenft1f7nfpgsaen3uwkhp6a3trl6u59qaapd597lnwplh75m3fer8ls2q2rmv5g',
date: '2023-09-24T13:39:27',
},
// The Call of the Wild
{
classId:
'likenft1yxedh53ay49u8xu6aqg6aa0gr6jj9svy40q3wjv266v6pvrzyj4s6hszzj',
date: '2023-09-25T19:41:12',
},
// 死水微瀾
{
classId:
'likenft1tjyaqr0e3pfv9squz0grs95sdnfjgr6kd59e2aen3krmdge28cesnjt8de',
date: '2023-09-28T11:20:45',
},
];

export const LIKECOIN_NFT_CAMPAIGN_ITEMS = IS_TESTNET
Expand Down
6 changes: 5 additions & 1 deletion src/locales/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -263,8 +263,10 @@
"home_button_about_writing_nft": "What is Writing NFT ?",
"home_section_articles_title": "Top Articles",
"home_section_book_title": "Featured Books",
"identity_type_author": "Author",
"identity_type_collector": "Collector",
"identity_type_creator": "Creator",
"identity_type_publisher": "Publisher",
"index_page_all_stories_matter_blog_content": "Liker Land Writing NFT widget lets you start a paid subscription or publish paid posts based on your open content from any writing platform such as WordPress, or Substack etc.",
"index_page_all_stories_matter_blog_heading": "Blogs",
"index_page_all_stories_matter_cta_button": "Publish your story",
Expand Down Expand Up @@ -657,8 +659,8 @@
"language": "Language",
"title": "Settings"
},
"shopping_cart_checkout_button_by_LIKE": "Checkout by LIKE",
"shopping_cart_checkout_button_by_card": "Checkout by card",
"shopping_cart_checkout_button_by_LIKE": "Checkout by LIKE",
"shopping_cart_empty_notice": "Backpack is empty",
"shopping_cart_empty_notice_button": "Browse NFT",
"shopping_cart_error_insufficient_balance": "Insufficient balance, you only have {balance}",
Expand Down Expand Up @@ -689,6 +691,8 @@
"snackbar_error_seq_mismatch": "Transaction sequence error. Please wait for a moment until the account status matches, and then try purchasing again.",
"snackbar_success_collect": "Complete the collect of \"{NFT}\".",
"snackbar_success_transfer": "Complete the transfer of NFT.",
"store_books_page_title": "All Books",
"store_nft_book_more_button": "More Books",
"subVPs": [
"The easiest way to send and receive LikeCoin.",
"View the weekly, daily statistics of your LikeCoin bonus, down to each workpiece.",
Expand Down
Loading
Loading