noham/lanyard-profile-readme
1
0
Fork 0
mirror of https://github.com/NohamR/lanyard-profile-readme.git synced 2026-05-25 04:17:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

use-smooth-count for userCount

Browse Source
This commit is contained in:
cnrad
2022-04-16 01:03:43 -04:00
parent 59f916bd48
commit 92f76139ca
3 changed files with 63 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@@ -20,7 +20,8 @@
"next": "11.0.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"styled-components": "^5.3.0"
"styled-components": "^5.3.0",
"use-smooth-count": "^0.2.0"
},
"devDependencies": {
"@types/escape-html": "^1.0.1",

27
pages/index.tsx
View File

@@ -1,13 +1,17 @@
import Head from "next/head";
import styled, { createGlobalStyle } from "styled-components";
import { useState, useEffect } from "react";
import { useState, useEffect, useRef } from "react";
import axios from "axios";
import { useSmoothCount } from "use-smooth-count";
export default function Home() {
const [userCount, setUserCount] = useState<null | number>(null);
export default function Home({ userCount }: { userCount: number }) {
const [userId, setUserId] = useState<null | string>(null);
const [userError, setUserError] = useState<string>();
const [copyState, setCopyState] = useState("Copy");
const countRef = useRef<HTMLSpanElement | null>(null);
const counter = useSmoothCount(countRef, userCount, 3, { curve: [0, 1, 0, 1] });
const copy = () => {
navigator.clipboard.writeText(
`[![Discord Presence](https://lanyard.cnrad.dev/api/${userId})](https://discord.com/users/${userId})`
@@ -17,13 +21,6 @@ export default function Home() {
setTimeout(() => setCopyState("Copy"), 1500);
};
useEffect(() => {
(async () => {
let userCount = await axios.get("/api/getUserCount").then(res => res.data);
setUserCount(userCount.count);
})();
}, []);
useEffect(() => {
(async () => {
try {
@@ -94,12 +91,20 @@ export default function Home() {
</Container>
</Main>
<FooterStat>
Lanyard Profile Readme has <b>{userCount}</b> total users!
Lanyard Profile Readme has <span style={{ fontWeight: "bold" }} ref={countRef} /> total users!
</FooterStat>
</>
);
}
export async function getServerSideProps(ctx: any) {
let userCount = await axios.get("https://lanyard.cnrad.dev/api/getUserCount").then(res => res.data.count);
return {
props: { userCount },
};
}
const GlobalStyle = createGlobalStyle`
*, *::before, *::after {
box-sizing: border-box;

45
yarn.lock
View File

@@ -1512,6 +1512,19 @@ framer-motion@^4.1.17:
optionalDependencies:
"@emotion/is-prop-valid" "^0.8.2"
framer-motion@^6.3.0:
version "6.3.0"
resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-6.3.0.tgz#0e50ef04b4fa070fca7d04bc32fb1d64027b7ea7"
integrity sha512-Nm6l2cemuFeSC1fmq9R32sCQs1eplOuZ3r14/PxRDewpE3NUr+ul5ulGRRzk8K0Aa5p76Tedi3sfCUaTPa5fRg==
dependencies:
framesync "6.0.1"
hey-listen "^1.0.8"
popmotion "11.0.3"
style-value-types "5.0.0"
tslib "^2.1.0"
optionalDependencies:
"@emotion/is-prop-valid" "^0.8.2"
framesync@5.3.0:
version "5.3.0"
resolved "https://registry.yarnpkg.com/framesync/-/framesync-5.3.0.tgz#0ecfc955e8f5a6ddc8fdb0cc024070947e1a0d9b"
@@ -1519,6 +1532,13 @@ framesync@5.3.0:
dependencies:
tslib "^2.1.0"
framesync@6.0.1:
version "6.0.1"
resolved "https://registry.yarnpkg.com/framesync/-/framesync-6.0.1.tgz#5e32fc01f1c42b39c654c35b16440e07a25d6f20"
integrity sha512-fUY88kXvGiIItgNC7wcTOl0SNRCVXMKSWW2Yzfmn7EKNc+MpCzcz9DhdHcdjbrtN3c6R4H5dTY2jiCpPdysEjA==
dependencies:
tslib "^2.1.0"
fs.realpath@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
@@ -2588,6 +2608,16 @@ pnp-webpack-plugin@1.6.4:
dependencies:
ts-pnp "^1.1.6"
popmotion@11.0.3:
version "11.0.3"
resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-11.0.3.tgz#565c5f6590bbcddab7a33a074bb2ba97e24b0cc9"
integrity sha512-Y55FLdj3UxkR7Vl3s7Qr4e9m0onSnP8W7d/xQLsoJM40vs6UKHFdygs6SWryasTZYqugMjm3BepCF4CWXDiHgA==
dependencies:
framesync "6.0.1"
hey-listen "^1.0.8"
style-value-types "5.0.0"
tslib "^2.1.0"
popmotion@9.3.6:
version "9.3.6"
resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-9.3.6.tgz#b5236fa28f242aff3871b9e23721f093133248d1"
@@ -3191,6 +3221,14 @@ style-value-types@4.1.4:
hey-listen "^1.0.8"
tslib "^2.1.0"
style-value-types@5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/style-value-types/-/style-value-types-5.0.0.tgz#76c35f0e579843d523187989da866729411fc8ad"
integrity sha512-08yq36Ikn4kx4YU6RD7jWEv27v4V+PUsOGa4n/as8Et3CuODMJQ00ENeAVXAeydX4Z2j1XHZF1K2sX4mGl18fA==
dependencies:
hey-listen "^1.0.8"
tslib "^2.1.0"
styled-components@^5.3.0:
version "5.3.0"
resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.0.tgz#e47c3d3e9ddfff539f118a3dd0fd4f8f4fb25727"
@@ -3399,6 +3437,13 @@ url@^0.11.0:
punycode "1.3.2"
querystring "0.2.0"
use-smooth-count@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/use-smooth-count/-/use-smooth-count-0.2.0.tgz#0cd3a9042ad3663444ed7a2150ab2ba2fa052a81"
integrity sha512-UOMOW41Wq0r8nY2t4CC12tz5p2Nmu81D5fN0fFUIobe91t2qt20z1jU1Dbd5MkA+QDFdQYGusjjSnvloqzLqxQ==
dependencies:
framer-motion "^6.3.0"
use-subscription@1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/use-subscription/-/use-subscription-1.5.1.tgz#73501107f02fad84c6dd57965beb0b75c68c42d1"