feat: update view on

This commit is contained in:
DIYgod 2023-01-31 23:19:12 +00:00
parent 1a274d9805
commit 76ef0059c7
No known key found for this signature in database
6 changed files with 121 additions and 26 deletions

View File

@ -26,7 +26,6 @@
"henryqw",
"twifag",
"hominsu",
"exodus-exodus",
"colojayce",
"stars",
"somehacker",

View File

@ -4,23 +4,44 @@ export const RSS3Icon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
props,
) => {
return (
<svg
width="1em"
height="1em"
{...props}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 604.24 150.74"
>
<svg {...props} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
<g id="Layer_2" data-name="Layer 2">
<g id="bg">
<rect width="1024" height="1024" fill="#0072ff" />
</g>
<g id="Layer_1-2" data-name="Layer 1">
<g id="Layer_2-2" data-name="Layer 2">
<g id="图层_1" data-name="图层 1">
<path d="M423.88,89c-8.5-12.62-29-19.34-43.67-23.3-1.71-.45-3.49-.9-5.38-1.37h-.15c-7.9-2-16.87-4.21-23.85-8-8-4.38-11.92-10.06-11.92-17.36a17.44,17.44,0,0,1,.33-3.53v-.21a14.29,14.29,0,0,1,.42-1.59,1.72,1.72,0,0,1,.07-.21v-.08a20.29,20.29,0,0,1,5.06-8c5.93-6,15.39-9.37,26-9.37h.33a55.82,55.82,0,0,1,22.57,5.31A60.82,60.82,0,0,1,412.5,34.63l.13,15.21V50h13.2V4.2H412.66V14.58a.45.45,0,0,1-.21.38.6.6,0,0,1-.36-.16A67.44,67.44,0,0,0,393.7,4.89a70.74,70.74,0,0,0-22-3.82c-8.59,0-15.61,1-21.47,2.91a41.17,41.17,0,0,0-13.35,7.43A35,35,0,0,0,326.81,24a35.93,35.93,0,0,0-3.46,15.18,32.19,32.19,0,0,0,1.15,9.21,34.51,34.51,0,0,0,4.5,9.33c.17.27.37.53.55.79s.19.25.28.38l.12.16c8.65,12,28,17.24,42.05,21.13l.39.1,3.13.87,3.39.91a138.79,138.79,0,0,1,21.48,7.16,25.37,25.37,0,0,1,9.35,7.09,21.89,21.89,0,0,1,4.59,9.83,21.41,21.41,0,0,1-.79,10.77,27.15,27.15,0,0,1-6.69,10.55A32,32,0,0,1,395.44,134a47.86,47.86,0,0,1-12.66,2.27A64.28,64.28,0,0,1,362.36,134c-11.25-3.56-21.52-10.43-28.18-18.82a2.63,2.63,0,0,1-.49-.92l-.13-13.08V101h-13.2v47.88h13.21v-14a57.5,57.5,0,0,0,18.84,11.06,78.21,78.21,0,0,0,25.27,4.82h1.07c7.33,0,24.48,0,37.93-11.39a39.26,39.26,0,0,0,9.09-11.48A40.12,40.12,0,0,0,430,114.4a37.23,37.23,0,0,0-.62-13.51A31.08,31.08,0,0,0,423.88,89Z" />
<path d="M293.54,89c-8.33-12.56-28.91-19.31-43.67-23.29-1.68-.44-3.42-.87-5.27-1.33-16-3.95-35.92-8.88-36.15-25.45A17.71,17.71,0,0,1,210,31.69a21.44,21.44,0,0,1,4.52-6.4c6-5.92,15.41-9.32,25.94-9.32h.33a55.69,55.69,0,0,1,22.55,5.31A60.07,60.07,0,0,1,282,34.62l.26,15.21V50h13.2V4.2H282.33V14.58a.48.48,0,0,1-.2.38.43.43,0,0,1-.37-.16,67.44,67.44,0,0,0-18.39-9.91,70.74,70.74,0,0,0-22-3.82c-8.64,0-15.68,1-21.52,2.91a41.2,41.2,0,0,0-13.3,7.43A35,35,0,0,0,196.48,24,36,36,0,0,0,193,39.22a32.87,32.87,0,0,0,1.13,9.2,35.19,35.19,0,0,0,4.38,9.3c8.29,12.92,28.57,18.47,43.38,22.53l.35.09,2.94.81,3.1.83.29.08a138.79,138.79,0,0,1,21.48,7.16,25.86,25.86,0,0,1,9.4,7.14,22.25,22.25,0,0,1,4.61,9.92,21.46,21.46,0,0,1-.82,10.78,27.1,27.1,0,0,1-6.73,10.53,31.34,31.34,0,0,1-11.36,6.49,47.22,47.22,0,0,1-12.69,2.22c-.89,0-1.82.06-2.76.06a65.49,65.49,0,0,1-17.83-2.43c-.67-.21-1.35-.44-2-.68h-.1c-1.35-.48-2.7-1-4-1.61a60.4,60.4,0,0,1-17.63-11.79l-.26-.25c-.8-.8-1.61-1.65-2.39-2.54l-.6-.69c-.35-.41-.69-.81-1-1.23a2.66,2.66,0,0,1-.48-.91l-.13-13.08V101H189.89v47.88h13.34v-14a57.5,57.5,0,0,0,18.84,11.06,78.21,78.21,0,0,0,25.27,4.82h1.07c7.29,0,24.36,0,37.93-11.39a39.26,39.26,0,0,0,9.09-11.48,40.11,40.11,0,0,0,4.25-13.38,37.23,37.23,0,0,0-.62-13.51A31.14,31.14,0,0,0,293.54,89Z" />
<path d="M158.15,137.47,122.07,82.92a39.84,39.84,0,0,0,17.78-3.45c7.89-4,14.23-9.07,18.12-16.57a43.72,43.72,0,0,0,4.78-20,41.63,41.63,0,0,0-12-29.21C142.41,6.13,132,2.45,118.91,2.45H49V17.54H63.84V137.65H47.7v12.62H94.55V137.65H79.46V83.14h25.25l35.35,54.51H124v12.62h50.42V137.65H158.65A.66.66,0,0,1,158.15,137.47ZM79.46,16.86h38.67c11.88,0,21,4.72,25.62,12.83a26.81,26.81,0,0,1-.42,26.47c-4.74,8-10.34,12.42-22.76,12.42H79.46Z" />
<path d="M550.46,106.56c0-18.11-9.15-31.19-24.33-36.8C539,63,544.68,51.88,544.68,40.43,544.68,14,522.51,0,493.6,0,477.82.12,461,5.37,449.51,21.5l12,7.83C467.94,20.68,477.1,14,493.6,14c21,0,35.9,8.53,35.9,24.77C529.5,54.33,514.56,63,499.26,63H478.42V78h22.05c19.51,0,34.93,10.51,34.45,28.39-1.09,19-17.83,29.21-39.75,29.21-14.1,0-29.76-4.44-41.45-16.94l-.6-.23-10.24,11.21.48.12c14.7,13.79,32.17,20.92,51.81,20.92C525.41,150.62,550.46,134.26,550.46,106.56Z" />
<rect y="68.48" width="37.98" height="15.51" />
<rect x="566.26" y="68.48" width="37.98" height="15.51" />
<path
d="M655.79,528.1c-10-14.91-34.25-22.84-51.57-27.52-2-.53-4.12-1.06-6.36-1.62h-.17c-9.33-2.36-19.93-5-28.17-9.44-9.45-5.18-14.07-11.88-14.07-20.5a20.82,20.82,0,0,1,.39-4.17v-.25a17.3,17.3,0,0,1,.49-1.88,2.41,2.41,0,0,1,.08-.25v-.09a24,24,0,0,1,6-9.45c7-7.08,18.17-11.06,30.7-11.06h.39a66,66,0,0,1,26.66,6.27,71.68,71.68,0,0,1,22.21,15.75l.15,18V482h15.59V428H642.54v12.25a.54.54,0,0,1-.25.45.7.7,0,0,1-.43-.19,79.69,79.69,0,0,0-21.71-11.7,83.89,83.89,0,0,0-26-4.51c-10.15,0-18.44,1.18-25.36,3.44a48.58,48.58,0,0,0-15.76,8.77,41.19,41.19,0,0,0-11.89,14.87,42.25,42.25,0,0,0-4.09,17.92,37.68,37.68,0,0,0,1.36,10.88,40.78,40.78,0,0,0,5.31,11c.2.32.44.62.65.93s.23.3.33.45l.14.19c10.22,14.11,33,20.36,49.66,24.95l.46.12,3.7,1,4,1.07a163.1,163.1,0,0,1,25.37,8.46,29.78,29.78,0,0,1,11,8.37,25.89,25.89,0,0,1,5.42,11.61,25.29,25.29,0,0,1-.93,12.71,32.25,32.25,0,0,1-7.9,12.46,37.91,37.91,0,0,1-13.48,7.73,56.74,56.74,0,0,1-15,2.68,75.79,75.79,0,0,1-24.11-2.73c-13.29-4.2-25.42-12.32-33.28-22.23a3.23,3.23,0,0,1-.58-1.08l-.15-15.45v-.2H533.54v56.54h15.6V582.24a68,68,0,0,0,22.25,13.06A92.46,92.46,0,0,0,601.23,601h1.26c8.66,0,28.91,0,44.79-13.45A46.31,46.31,0,0,0,658,574a47.42,47.42,0,0,0,5-15.9,44.12,44.12,0,0,0-.73-16A36.57,36.57,0,0,0,655.79,528.1Z"
fill="#fff"
/>
<path
d="M501.87,528.1c-9.84-14.84-34.14-22.81-51.57-27.51-2-.52-4-1-6.23-1.57-18.89-4.66-42.41-10.48-42.69-30a20.83,20.83,0,0,1,1.84-8.55,25.4,25.4,0,0,1,5.33-7.56c7.09-7,18.2-11,30.64-11h.39a65.77,65.77,0,0,1,26.62,6.27,70.8,70.8,0,0,1,22.09,15.76l.3,18v.2h15.59V428H488.63v12.25a.54.54,0,0,1-.24.45.5.5,0,0,1-.43-.19,79.89,79.89,0,0,0-21.72-11.7,83.89,83.89,0,0,0-26-4.51c-10.2,0-18.52,1.18-25.41,3.44a48.53,48.53,0,0,0-15.71,8.77,41.19,41.19,0,0,0-11.89,14.87,42.31,42.31,0,0,0-4.11,18,38.22,38.22,0,0,0,1.33,10.86,41.42,41.42,0,0,0,5.18,11c9.79,15.25,33.74,21.81,51.22,26.6l.42.11,3.47,1,3.66,1,.34.09a163.1,163.1,0,0,1,25.37,8.46,30.44,30.44,0,0,1,11.1,8.43,26.23,26.23,0,0,1,5.44,11.71,25.26,25.26,0,0,1-1,12.73,32,32,0,0,1-7.94,12.44,37.05,37.05,0,0,1-13.42,7.66,55.69,55.69,0,0,1-15,2.62c-1.05,0-2.15.07-3.26.07A76.86,76.86,0,0,1,429,581.15c-.79-.24-1.59-.52-2.36-.8h-.12c-1.59-.57-3.19-1.18-4.72-1.9A71.34,71.34,0,0,1,401,564.53l-.31-.3c-.94-.94-1.9-2-2.82-3l-.71-.81c-.41-.49-.81-1-1.18-1.46a3.35,3.35,0,0,1-.57-1.07l-.15-15.45v-.2H379.47v56.54h15.75V582.25a67.79,67.79,0,0,0,22.25,13.06A92.46,92.46,0,0,0,447.31,601h1.26c8.61,0,28.77,0,44.8-13.45A46.44,46.44,0,0,0,504.1,574a47.32,47.32,0,0,0,5-15.8,44.18,44.18,0,0,0-.73-16A36.91,36.91,0,0,0,501.87,528.1Z"
fill="#fff"
/>
<path
d="M342,585.33l-42.61-64.41a46.93,46.93,0,0,0,21-4.08c9.32-4.72,16.81-10.71,21.4-19.57a51.54,51.54,0,0,0,5.65-23.61,49.16,49.16,0,0,0-14.17-34.5c-9.85-8.93-22.15-13.27-37.6-13.27H213.09v17.82h17.52V585.55H211.55v14.9h55.33v-14.9H249.06V521.18h29.82l41.74,64.37h-19v14.9H361.2v-14.9H342.58A.79.79,0,0,1,342,585.33ZM249.06,442.91h45.67c14,0,24.79,5.57,30.25,15.15a31.66,31.66,0,0,1-.5,31.25c-5.59,9.45-12.21,14.67-26.87,14.67H249.06Z"
fill="#fff"
/>
<path
d="M805.27,548.83c0-21.38-10.81-36.83-28.74-43.45,15.2-8,21.91-21.12,21.91-34.64,0-31.21-26.18-47.74-60.32-47.74-18.64.14-38.5,6.34-52.07,25.38l14.17,9.25c7.6-10.21,18.41-18.1,37.9-18.1,24.8,0,42.39,10.07,42.39,29.25,0,18.37-17.64,28.61-35.71,28.61H720.19v17.72h26c23,0,41.25,12.41,40.68,33.52-1.28,22.44-21,34.5-46.94,34.5-16.65,0-35.14-5.25-49-20l-.7-.27-12.1,13.24.57.14c17.36,16.28,38,24.7,61.18,24.7C775.68,600.86,805.27,581.54,805.27,548.83Z"
fill="#fff"
/>
<rect
x="155.23"
y="503.86"
width="44.85"
height="18.32"
fill="#fff"
/>
<rect
x="823.92"
y="503.86"
width="44.85"
height="18.32"
fill="#fff"
/>
</g>
</g>
</g>

View File

@ -0,0 +1,36 @@
import React from "react"
export const XCharIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
props,
) => {
return (
<svg
width="36"
height="36"
viewBox="0 0 36 36"
fill="none"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<g clipPath="url(#clip0_5172_21145)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M21.0568 32.3907C23.3998 32.1424 25.5483 30.9736 27.0295 29.1413C28.5108 27.3089 29.2035 24.9632 28.9552 22.6202C28.7785 20.9525 28.9382 19.6513 29.2452 18.6465C29.3311 18.365 32.375 17.4817 32.7897 17.1498C32.9517 17.0202 33.1188 16.8992 33.3086 16.7617L33.4861 16.6327C33.7386 16.4485 34.0221 16.2356 34.2885 15.991C35.2519 15.1063 35.5097 13.8731 35.3439 12.8034C35.1825 11.7626 34.598 10.7217 33.653 10.1563C33.64 10.1481 33.6255 10.1392 33.6094 10.1297C33.5709 10.1068 33.5231 10.0804 33.4649 10.0512C33.3485 9.9926 33.1904 9.92291 32.9814 9.8488C32.5641 9.70072 31.941 9.53398 31.0367 9.40459C29.2317 9.14665 23.4382 9.65906 18.7014 10.1609C13.9647 10.6628 7.75657 12.1829 6.04566 12.8134C5.18856 13.1294 4.61415 13.423 4.2372 13.6552C4.04843 13.7715 3.90834 13.8728 3.80685 13.9544C3.75599 13.9952 3.71483 14.031 3.68208 14.0615C3.66831 14.0742 3.65586 14.0859 3.64494 14.0967C2.83943 14.8475 2.48593 15.9878 2.54626 17.0393C2.60824 18.12 3.11897 19.2718 4.24617 19.9349C4.55803 20.1183 4.87991 20.267 5.16539 20.3943L5.36588 20.4831C5.58028 20.5779 5.76895 20.6612 5.95452 20.754C6.42969 20.9916 10.0271 20.4105 10.1702 20.6677C10.2762 20.8583 10.3784 21.0624 10.4755 21.2808C10.8796 22.364 11.1701 23.3943 11.2864 24.4923C11.5347 26.8353 12.7034 28.9838 14.5358 30.465C16.3681 31.9463 18.7138 32.6389 21.0568 32.3907Z"
fill="#6AD991"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.8145 1.17836C14.6625 1.54418 12.6257 2.41802 10.8253 3.74001C10.2719 4.14633 10.1504 4.93208 10.5538 5.49504C10.9573 6.05798 11.733 6.18494 12.2864 5.77862C13.7876 4.67636 15.4703 3.95812 17.236 3.65798C19.0018 3.35784 20.8273 3.47972 22.6083 4.02407C23.2649 4.22473 23.9552 3.84858 24.15 3.18394C24.3448 2.51929 23.9704 1.81784 23.3139 1.61718C21.1777 0.964341 18.9666 0.812544 16.8145 1.17836ZM21.0045 5.141C18.6535 4.56979 16.2648 4.97584 14.2346 6.29178C13.6588 6.66496 13.4927 7.44209 13.8636 8.02752C14.2345 8.61298 15.0019 8.78505 15.5776 8.41187C17.0422 7.46258 18.7415 7.17373 20.4374 7.58578C21.1041 7.74777 21.7716 7.33181 21.9282 6.6567C22.0848 5.9816 21.6712 5.30299 21.0045 5.141Z"
fill="#50C07B"
/>
</g>
<defs>
<clipPath id="clip0_5172_21145">
<rect width="36" height="36" fill="white" />
</clipPath>
</defs>
</svg>
)
}

View File

@ -0,0 +1,29 @@
import React from "react"
export const XFeedIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
props,
) => {
return (
<svg
width="37"
height="36"
viewBox="0 0 37 36"
fill="none"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M23.0374 7.2464C22.9495 5.44116 21.8769 3.91545 20.2028 3.28731C18.4273 2.62116 16.4292 3.12788 15.0615 4.65681C14.5692 5.20717 14.0947 5.78512 13.647 6.37575C12.768 7.53518 11.3054 8.28506 9.71675 8.37152C8.83098 8.41973 8.07045 8.48646 7.40872 8.56562C4.22711 8.94627 1.94045 11.1417 1.41701 13.6633C1.18034 14.8034 1 16.0937 1 17.3579C1 18.6222 1.18034 19.9125 1.41701 21.0526C1.94045 23.5741 4.22711 25.7697 7.40872 26.1502C8.07045 26.2293 8.83098 26.2962 9.71675 26.3443C11.3054 26.4309 12.768 27.1808 13.647 28.3402C14.0947 28.9306 14.5692 29.5086 15.0615 30.059C16.4292 31.588 18.4273 32.0948 20.2028 31.4286C21.8769 30.8005 22.9495 29.2746 23.0374 27.4694C23.1581 24.9885 23.2548 21.6588 23.2548 17.3579C23.2548 13.0571 23.1581 9.72736 23.0374 7.2464Z"
fill="#FFDF99"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M33.0244 19.0242C33.0244 16.8413 32.5042 14.6869 31.5027 12.6904C31.1948 12.0768 30.4405 11.8253 29.8179 12.1287C29.1953 12.4321 28.9402 13.1755 29.248 13.7892C30.0831 15.4539 30.5092 17.2332 30.5092 19.0242C30.5092 20.8153 30.0831 22.5946 29.248 24.2592C28.9402 24.8729 29.1953 25.6164 29.8179 25.9198C30.4405 26.2233 31.1948 25.9717 31.5027 25.3581C32.5042 23.3615 33.0244 21.2072 33.0244 19.0242ZM28.4157 22.4909C29.3728 20.2689 29.3728 17.8459 28.4157 15.6238C28.1442 14.9937 27.4059 14.6997 26.7666 14.9673C26.1273 15.2348 25.8291 15.9625 26.1005 16.5926C26.7909 18.1955 26.7909 19.9192 26.1005 21.5221C25.8291 22.1523 26.1273 22.88 26.7666 23.1475C27.4059 23.415 28.1442 23.121 28.4157 22.4909Z"
fill="#F6C549"
/>
</svg>
)
}

View File

@ -1,6 +1,6 @@
import clsx from "clsx"
import { useRouter } from "next/router"
import { CSB_SCAN, CSB_IO } from "~/lib/env"
import { CSB_SCAN, CSB_IO, CSB_XCHAR } from "~/lib/env"
import { getUserContentsUrl } from "~/lib/user-contents"
import { Avatar } from "../ui/Avatar"
import { Button } from "../ui/Button"
@ -9,10 +9,13 @@ import { Profile } from "~/lib/types"
import { ConnectButton } from "../common/ConnectButton"
import { BlockchainIcon } from "~/components/icons/BlockchainIcon"
import { RSS3Icon } from "~/components/icons/RSS3Icon"
import { EllipsisHorizontalIcon, RssIcon } from "@heroicons/react/20/solid"
import { EllipsisHorizontalIcon } from "@heroicons/react/20/solid"
import { Image } from "~/components/ui/Image"
import { FollowingButton } from "~/components/common/FollowingButton"
import { FollowingCount } from "~/components/common/FollowingCount"
import { RssIcon } from "@heroicons/react/24/solid"
import { XCharIcon } from "~/components/icons/XCharIcon"
import { XFeedIcon } from "~/components/icons/XFeedIcon"
export type HeaderLinkType = {
icon?: React.ReactNode
@ -50,28 +53,33 @@ export const SiteHeader: React.FC<{
const moreMenuItems = [
{
text: "View on Crossbell.io",
icon: <span className="i-bxs:bell inline-block"></span>,
url: CSB_IO && `${CSB_IO}/@${site?.username}`,
text: "View on xChar",
icon: <XCharIcon className="w-4 h-4" />,
url: `${CSB_XCHAR}/${site?.username}`,
},
{
text: "View on xFeed",
icon: <XFeedIcon className="w-4 h-4" />,
url: `${CSB_IO}/@${site?.username}`,
},
{
text: "View on RSS3",
icon: <RSS3Icon />,
icon: <RSS3Icon className="w-4 h-4 rounded" />,
url: `https://rss3.io/result?search=${site?.username}.csb`,
},
{
text: "View on blockchain explorer",
icon: <BlockchainIcon />,
text: "View on Crossbell Scan",
icon: <BlockchainIcon className="fill-[#c09526]" />,
url: `${CSB_SCAN}/address/${site?.metadata?.owner}`,
},
{
text: "JSON Feed",
icon: <RssIcon className="w-4 h-4" />,
icon: <RssIcon className="w-4 h-4 text-[#ee832f]" />,
url: `/feed`,
},
{
text: "RSS",
icon: <RssIcon className="w-4 h-4" />,
icon: <RssIcon className="w-4 h-4 text-[#ee832f]" />,
url: `/feed/xml`,
},
]
@ -136,8 +144,8 @@ export const SiteHeader: React.FC<{
>
<EllipsisHorizontalIcon className="w-5 h-5" />
</Button>
<div className="absolute hidden right-0 sm:left-0 pt-2 group-hover:block top-full z-10 text-gray-600 w-60">
<div className="bg-white rounded-lg ring-1 ring-zinc-100 min-w-[140px] shadow-md py-2 text-sm">
<div className="absolute hidden right-0 sm:left-0 pt-2 group-hover:block top-full z-10 text-gray-600 w-52">
<div className="bg-white rounded-lg ring-1 ring-zinc-100 shadow-md py-2 text-sm">
{moreMenuItems.map((item) => {
return (
<UniLink

View File

@ -13,5 +13,7 @@ export const TWITTER_LINK = process.env.NEXT_PUBLIC_TWITTER_LINK
export const CSB_IO = process.env.NEXT_PUBLIC_CSB_IO || "https://crossbell.io"
export const CSB_SCAN =
process.env.NEXT_PUBLIC_CSB_SCAN || "https://scan.crossbell.io"
export const CSB_XCHAR =
process.env.NEXT_PUBLIC_CSB_XCHAR || "https://xchar.app"
export const IPFS_GATEWAY =
process.env.NEXT_PUBLIC_IPFS_GATEWAY || "https://ipfs.4everland.xyz/ipfs/"