diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml index c884585bac7..374ccb1c7d8 100644 --- a/.github/workflows/pull-request.yml +++ b/.github/workflows/pull-request.yml @@ -1,134 +1,134 @@ -name: Pull Request - -defaults: - run: - working-directory: ./rust - -on: - pull_request: - push: - branches: [master] - -jobs: - all_github_action_checks: - runs-on: ubuntu-latest - needs: - - rustfmt - - clippy - - cargo-build-test - steps: - - run: echo "Done" - working-directory: ./ - - rustfmt: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v2 - - - name: Set env vars - run: | - source ci/rust-version.sh - echo "RUST_STABLE=$rust_stable" >> $GITHUB_ENV - - - uses: actions-rs/toolchain@v1 - with: - toolchain: ${{ env.RUST_STABLE }} - override: true - profile: minimal - components: rustfmt - - - name: Run fmt - uses: actions-rs/cargo@v1 - with: - command: fmt - args: --manifest-path ./rust/Cargo.toml --all -- --check - - clippy: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v2 - - - name: Set env vars - run: | - source ci/rust-version.sh - echo "RUST_NIGHTLY=$rust_nightly" >> $GITHUB_ENV - - - uses: actions-rs/toolchain@v1 - with: - toolchain: ${{ env.RUST_NIGHTLY }} - override: true - profile: minimal - components: clippy - - - uses: actions/cache@v2 - with: - path: | - ~/.cargo/registry - ~/.cargo/git - target - key: cargo-clippy-${{ hashFiles('**/Cargo.lock') }} - restore-keys: | - cargo-clippy- - - - name: Install dependencies - run: ./ci/install-build-deps.sh - - - name: Run clippy - uses: actions-rs/cargo@v1 - with: - command: clippy - args: --manifest-path ./rust/Cargo.toml -Zunstable-options --workspace --all-targets -- --deny=warnings - - cargo-build-test: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v2 - - - name: Set env vars - run: | - source ci/rust-version.sh - echo "RUST_STABLE=$rust_stable" >> $GITHUB_ENV - source ci/solana-version.sh - echo "SOLANA_VERSION=$solana_version" >> $GITHUB_ENV - - - uses: actions-rs/toolchain@v1 - with: - toolchain: ${{ env.RUST_STABLE }} - override: true - profile: minimal - - - uses: actions/cache@v2 - with: - path: | - ~/.cargo/registry - ~/.cargo/git - # target # Removed due to build dependency caching conflicts - key: cargo-build-${{ hashFiles('**/Cargo.lock') }}-${{ env.RUST_STABLE}} - - - uses: actions/cache@v2 - with: - path: | - ~/.cargo/bin/rustfilt - key: cargo-bpf-bins-${{ runner.os }} - - - uses: actions/cache@v2 - with: - path: | - ~/.cache - key: solana-${{ env.SOLANA_VERSION }} - - - name: Install dependencies - run: | - ./ci/install-build-deps.sh - ./ci/install-program-deps.sh - echo "$HOME/.local/share/solana/install/active_release/bin" >> $GITHUB_PATH - - - name: Build and test - run: ./ci/cargo-build-test.sh - - - name: Upload programs - uses: actions/upload-artifact@v2 - with: - name: programs - path: "rust/target/deploy/*.so" - if-no-files-found: error +# name: Pull Request + +# defaults: +# run: +# working-directory: ./rust + +# on: +# pull_request: +# push: +# branches: [master] + +# jobs: +# all_github_action_checks: +# runs-on: ubuntu-latest +# needs: +# - rustfmt +# - clippy +# - cargo-build-test +# steps: +# - run: echo "Done" +# working-directory: ./ + +# rustfmt: +# runs-on: ubuntu-latest +# steps: +# - uses: actions/checkout@v2 + +# - name: Set env vars +# run: | +# source ci/rust-version.sh +# echo "RUST_STABLE=$rust_stable" >> $GITHUB_ENV + +# - uses: actions-rs/toolchain@v1 +# with: +# toolchain: ${{ env.RUST_STABLE }} +# override: true +# profile: minimal +# components: rustfmt + +# - name: Run fmt +# uses: actions-rs/cargo@v1 +# with: +# command: fmt +# args: --manifest-path ./rust/Cargo.toml --all -- --check + +# clippy: +# runs-on: ubuntu-latest +# steps: +# - uses: actions/checkout@v2 + +# - name: Set env vars +# run: | +# source ci/rust-version.sh +# echo "RUST_NIGHTLY=$rust_nightly" >> $GITHUB_ENV + +# - uses: actions-rs/toolchain@v1 +# with: +# toolchain: ${{ env.RUST_NIGHTLY }} +# override: true +# profile: minimal +# components: clippy + +# - uses: actions/cache@v2 +# with: +# path: | +# ~/.cargo/registry +# ~/.cargo/git +# target +# key: cargo-clippy-${{ hashFiles('**/Cargo.lock') }} +# restore-keys: | +# cargo-clippy- + +# - name: Install dependencies +# run: ./ci/install-build-deps.sh + +# - name: Run clippy +# uses: actions-rs/cargo@v1 +# with: +# command: clippy +# args: --manifest-path ./rust/Cargo.toml -Zunstable-options --workspace --all-targets -- --deny=warnings + +# cargo-build-test: +# runs-on: ubuntu-latest +# steps: +# - uses: actions/checkout@v2 + +# - name: Set env vars +# run: | +# source ci/rust-version.sh +# echo "RUST_STABLE=$rust_stable" >> $GITHUB_ENV +# source ci/solana-version.sh +# echo "SOLANA_VERSION=$solana_version" >> $GITHUB_ENV + +# - uses: actions-rs/toolchain@v1 +# with: +# toolchain: ${{ env.RUST_STABLE }} +# override: true +# profile: minimal + +# - uses: actions/cache@v2 +# with: +# path: | +# ~/.cargo/registry +# ~/.cargo/git +# # target # Removed due to build dependency caching conflicts +# key: cargo-build-${{ hashFiles('**/Cargo.lock') }}-${{ env.RUST_STABLE}} + +# - uses: actions/cache@v2 +# with: +# path: | +# ~/.cargo/bin/rustfilt +# key: cargo-bpf-bins-${{ runner.os }} + +# - uses: actions/cache@v2 +# with: +# path: | +# ~/.cache +# key: solana-${{ env.SOLANA_VERSION }} + +# - name: Install dependencies +# run: | +# ./ci/install-build-deps.sh +# ./ci/install-program-deps.sh +# echo "$HOME/.local/share/solana/install/active_release/bin" >> $GITHUB_PATH + +# - name: Build and test +# run: ./ci/cargo-build-test.sh + +# - name: Upload programs +# uses: actions/upload-artifact@v2 +# with: +# name: programs +# path: "rust/target/deploy/*.so" +# if-no-files-found: error diff --git a/README.md b/README.md index 7f3107ef74e..99dfaf8ea8e 100644 --- a/README.md +++ b/README.md @@ -28,6 +28,7 @@ $ cd metaplex $ cd js $ yarn install $ yarn bootstrap +$ yarn build $ yarn start ``` diff --git a/js/packages/cli/src/fair-launch-cli.ts b/js/packages/cli/src/fair-launch-cli.ts index 2ed04c273e0..71951af48f9 100755 --- a/js/packages/cli/src/fair-launch-cli.ts +++ b/js/packages/cli/src/fair-launch-cli.ts @@ -1602,7 +1602,7 @@ async function getParticipationNft({ ) { console.log(buyer.toBase58(), 'gets participation token.'); const mint = anchor.web3.Keypair.generate(); - let signers = [mint]; + const signers = [mint]; const tokenAccount = ( await getParticipationToken( fairLaunchObj.authority, @@ -1610,7 +1610,7 @@ async function getParticipationNft({ ) )[0]; const buyerTokenNft = (await getAtaForMint(mint.publicKey, buyer))[0]; - let instructions = [ + const instructions = [ anchor.web3.SystemProgram.createAccount({ fromPubkey: payer.publicKey, newAccountPubkey: mint.publicKey, @@ -1685,7 +1685,6 @@ async function punchTicket({ fairLaunch, fairLaunchLotteryBitmap, fairLaunchObj, - fairLaunchTicketObj, }: { puncher: anchor.web3.PublicKey; anchorProgram: anchor.Program; diff --git a/js/packages/cli/src/helpers/upload/aws.ts b/js/packages/cli/src/helpers/upload/aws.ts index 0636cf30200..1eb0b5ec720 100644 --- a/js/packages/cli/src/helpers/upload/aws.ts +++ b/js/packages/cli/src/helpers/upload/aws.ts @@ -2,26 +2,32 @@ import log from 'loglevel'; import { basename } from 'path'; import { createReadStream } from 'fs'; import { Readable } from 'form-data'; -import { S3Client, PutObjectCommand } from "@aws-sdk/client-s3"; +import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'; -async function uploadFile(s3Client: S3Client, awsS3Bucket: string, filename: string, contentType: string, body: string | Readable | ReadableStream | Blob | Uint8Array | Buffer): Promise { +async function uploadFile( + s3Client: S3Client, + awsS3Bucket: string, + filename: string, + contentType: string, + body: string | Readable | ReadableStream | Blob | Uint8Array | Buffer, +): Promise { const mediaUploadParams = { Bucket: awsS3Bucket, Key: filename, Body: body, - ACL: "public-read", + ACL: 'public-read', ContentType: contentType, }; try { - const data = await s3Client.send(new PutObjectCommand(mediaUploadParams)); + await s3Client.send(new PutObjectCommand(mediaUploadParams)); log.info('uploaded filename:', filename); } catch (err) { log.debug('Error', err); - }; + } - const url = `https://${awsS3Bucket}.s3.amazonaws.com/${filename}` - log.debug("Location:", url); + const url = `https://${awsS3Bucket}.s3.amazonaws.com/${filename}`; + log.debug('Location:', url); return url; } @@ -30,14 +36,20 @@ export async function awsUpload( file: string, manifestBuffer: Buffer, ) { - const REGION = "us-east-1"; // TODO: Parameterize this. + const REGION = 'us-east-1'; // TODO: Parameterize this. const s3Client = new S3Client({ region: REGION }); const filename = `assets/${basename(file)}`; log.debug('file:', file); log.debug('filename:', filename); const fileStream = createReadStream(file); - const mediaUrl = await uploadFile(s3Client, awsS3Bucket, filename, "image/png", fileStream); + const mediaUrl = await uploadFile( + s3Client, + awsS3Bucket, + filename, + 'image/png', + fileStream, + ); // Copied from ipfsUpload const manifestJson = JSON.parse(manifestBuffer.toString('utf8')); @@ -47,8 +59,14 @@ export async function awsUpload( }); const updatedManifestBuffer = Buffer.from(JSON.stringify(manifestJson)); - const metadataFilename = filename.replace(/.png$/, ".json"); - const metadataUrl = await uploadFile(s3Client, awsS3Bucket, metadataFilename, "application/json", updatedManifestBuffer); + const metadataFilename = filename.replace(/.png$/, '.json'); + const metadataUrl = await uploadFile( + s3Client, + awsS3Bucket, + metadataFilename, + 'application/json', + updatedManifestBuffer, + ); return metadataUrl; } diff --git a/js/packages/common/src/components/AppBar/style.less b/js/packages/common/src/components/AppBar/style.less index 0c8bfcaf44b..d5332a6830f 100644 --- a/js/packages/common/src/components/AppBar/style.less +++ b/js/packages/common/src/components/AppBar/style.less @@ -10,33 +10,28 @@ position: relative; padding: 1rem; z-index: 2; - - .ant-menu-horizontal { - border-bottom-color: transparent; - background-color: transparent; - line-height: inherit; - font-size: 16px; - margin: 0 10px; - - .ant-menu-item { - margin: 0 10px; - color: lightgrey; - height: 35px; - line-height: 35px; - border-width: 0px !important; - } - - .ant-menu-item:hover { - color: white; - border-width: 0px !important; - } - - .ant-menu-item-selected { - font-weight: bold; - } - } } - +.App-Bar .ant-menu-horizontal { + border-bottom-color: transparent; + background-color: transparent; + line-height: inherit; + font-size: 16px; + margin: 0 10px; +} +.App-Bar .ant-menu-horizontal .ant-menu-item { + margin: 0 10px; + color: lightgrey; + height: 35px; + line-height: 35px; + border-width: 0px !important; +} +.App-Bar .ant-menu-horizontal .ant-menu-item:hover { + color: white; + border-width: 0px !important; +} +.App-Bar .ant-menu-horizontal .ant-menu-item-selected { + font-weight: bold; +} .App-Bar-left { box-sizing: border-box; margin: 0px; @@ -47,7 +42,6 @@ align-items: center; width: fit-content; } - .App-Bar-right { display: flex; flex-direction: row; diff --git a/js/packages/common/src/components/ConnectButton/index.tsx b/js/packages/common/src/components/ConnectButton/index.tsx index de642b83320..6c0ee549ecb 100644 --- a/js/packages/common/src/components/ConnectButton/index.tsx +++ b/js/packages/common/src/components/ConnectButton/index.tsx @@ -8,11 +8,11 @@ export interface ConnectButtonProps extends ButtonProps, React.RefAttributes { allowWalletChange?: boolean; + className?: string; } export const ConnectButton = (props: ConnectButtonProps) => { - const { onClick, children, disabled, allowWalletChange, ...rest } = props; - + const { children, disabled, allowWalletChange, className, ...rest } = props; const { wallet, connect, connected } = useWallet(); const { setVisible } = useWalletModal(); const open = useCallback(() => setVisible(true), [setVisible]); @@ -26,18 +26,27 @@ export const ConnectButton = (props: ConnectButtonProps) => { if (!wallet || !allowWalletChange) { return ( - ); } return ( + Change Wallet } diff --git a/js/packages/common/src/components/CurrentUserBadge/styles.less b/js/packages/common/src/components/CurrentUserBadge/styles.less index 5940a94bf7a..8132e41095b 100644 --- a/js/packages/common/src/components/CurrentUserBadge/styles.less +++ b/js/packages/common/src/components/CurrentUserBadge/styles.less @@ -5,7 +5,6 @@ align-items: center; white-space: nowrap; } - .wallet-key { padding: 0.1rem 0.5rem 0.1rem 0.7rem; margin-left: 0.3rem; diff --git a/js/packages/common/src/components/MetaplexModal/index.less b/js/packages/common/src/components/MetaplexModal/index.less index 13f8a9034be..354b2799a1a 100644 --- a/js/packages/common/src/components/MetaplexModal/index.less +++ b/js/packages/common/src/components/MetaplexModal/index.less @@ -5,5 +5,24 @@ } .ant-modal-content { - border-radius: 16px; + border-radius: 12px; + background: #2A2A2A; +} + +.ant-modal-header { + border-radius: 12px 12px 0 0; +} + +.ant-modal-body { + border-radius: 0 0 12px 12px; + background: rgba(255, 255, 255, 0.05); +} + +.ant-modal-close-x { + color: white; +} + +.ant-modal-title { + color: white; + font-weight: 600; } diff --git a/js/packages/common/src/components/MetaplexModal/index.tsx b/js/packages/common/src/components/MetaplexModal/index.tsx index 05b7be3ae13..23b89a1ac89 100644 --- a/js/packages/common/src/components/MetaplexModal/index.tsx +++ b/js/packages/common/src/components/MetaplexModal/index.tsx @@ -8,15 +8,15 @@ export const MetaplexModal = (props: any) => { {children} diff --git a/js/packages/common/src/components/Settings/index.tsx b/js/packages/common/src/components/Settings/index.tsx index 4e6fd46f2f9..4b86235f217 100644 --- a/js/packages/common/src/components/Settings/index.tsx +++ b/js/packages/common/src/components/Settings/index.tsx @@ -1,10 +1,13 @@ import React, { useCallback } from 'react'; import { Button, Select } from 'antd'; +import { Tooltip } from 'antd'; import { useWallet } from '@solana/wallet-adapter-react'; import { ENDPOINTS, useConnectionConfig } from '../../contexts/connection'; import { useWalletModal } from '../../contexts'; import { notify, shortenAddress } from '../../utils'; import { CopyOutlined } from '@ant-design/icons'; +import { Identicon } from '../Identicon'; +import { Link } from 'react-router-dom'; export const Settings = ({ additionalSettings, @@ -18,52 +21,56 @@ export const Settings = ({ return ( <> -
- Network:{' '} - - {connected && ( +
+ + {publicKey && ( <> - Wallet: - {publicKey && ( - - )} +  {shortenAddress(publicKey?.toBase58())} +
+ - - + View profile + )} +
+ {additionalSettings}
diff --git a/js/packages/common/src/components/index.tsx b/js/packages/common/src/components/index.tsx index bf58f3ed652..2e938f7430d 100644 --- a/js/packages/common/src/components/index.tsx +++ b/js/packages/common/src/components/index.tsx @@ -1,10 +1,8 @@ export { ExplorerLink } from './ExplorerLink/index'; export { ConnectButton } from './ConnectButton/index'; -export { CurrentUserBadge } from './CurrentUserBadge/index'; export { Identicon } from './Identicon/index'; export { Info } from './Icons/info'; export { NumericInput } from './Input/numeric'; -export { AppBar } from './AppBar/index'; export { Settings } from './Settings/index'; export { ActionConfirmation } from './ActionConfirmation/index'; export { BackButton } from './BackButton/index'; diff --git a/js/packages/common/src/config/userNames.json b/js/packages/common/src/config/userNames.json new file mode 100644 index 00000000000..3237e4155f0 --- /dev/null +++ b/js/packages/common/src/config/userNames.json @@ -0,0 +1,32 @@ +{ + "EDshWM3jBy2YUszMiFLAFLx3WkbtqR9An7JZzvg22R1P": { + "name": "Deployer Admin", + "image": "https://pbs.twimg.com/profile_images/1393399819213983746/2a8l5muc_400x400.png", + "description": "", + "background": "" + }, + "CduMjFZLBeg3A9wMP3hQCoU1RQzzCpgSvQNXfCi1GCSB": { + "name": "Bartosz Lipinski", + "image": "https://pbs.twimg.com/profile_images/1393353972371623938/ZMWvvptg_400x400.jpg", + "description": "", + "background": "" + }, + "44kiGWWsSgdqPMvmqYgTS78Mx2BKCWzduATkfY4biU97": { + "name": "Jordan Prince", + "image": "https://pbs.twimg.com/profile_images/1393399819213983746/2a8l5muc_400x400.png", + "description": "", + "background": "" + }, + "3yp9iTsCgZoBsXhtRLB8cWHNcTDeR6VJniRuDrHNTuxU": { + "name": "James Madison", + "image": "https://pbs.twimg.com/profile_images/1393353972371623938/ZMWvvptg_400x400.jpg", + "description": "", + "background": "" + }, + "SoL351y4uKWtbH14AU1Rhiao96aBM4u57bMi5Vj2XJc": { + "name": "Solana", + "image": "https://pbs.twimg.com/profile_images/1299400345144049665/sPxnVXa7_400x400.jpg", + "description": "Account used by Solana to mint official NFTs", + "background": "" + } +} diff --git a/js/packages/common/src/contexts/meta/onChangeAccount.ts b/js/packages/common/src/contexts/meta/onChangeAccount.ts index 8ddd312d7e3..499f45b7879 100644 --- a/js/packages/common/src/contexts/meta/onChangeAccount.ts +++ b/js/packages/common/src/contexts/meta/onChangeAccount.ts @@ -9,7 +9,7 @@ export const onChangeAccount = ): ProgramAccountChangeCallback => async info => { const pubkey = pubkeyToString(info.accountId); - const account = info.accountInfo + const account = info.accountInfo; await process( { @@ -17,7 +17,7 @@ export const onChangeAccount = account: { ...account, // to make sure these accounts get processed by processAuctions, processVaultData, etc - owner: account.owner.toBase58() as unknown as any + owner: account.owner.toBase58() as unknown as any, }, }, setter, diff --git a/js/packages/common/src/contexts/meta/processMetaplexAccounts.ts b/js/packages/common/src/contexts/meta/processMetaplexAccounts.ts index c18e9094460..efb00652e27 100644 --- a/js/packages/common/src/contexts/meta/processMetaplexAccounts.ts +++ b/js/packages/common/src/contexts/meta/processMetaplexAccounts.ts @@ -27,6 +27,7 @@ import { ProcessAccountsFunc } from './types'; import { METAPLEX_ID, programIds, pubkeyToString } from '../../utils'; import { ParsedAccount } from '../accounts'; import { cache } from '../accounts'; +import names from '../../config/userNames.json'; export const processMetaplexAccounts: ProcessAccountsFunc = async ( { account, pubkey }, @@ -168,6 +169,11 @@ export const processMetaplexAccounts: ProcessAccountsFunc = async ( parsedAccount.info.address, pubkey, ); + const nameInfo = (names as any)[parsedAccount.info.address]; + + if (nameInfo) { + parsedAccount.info = { ...parsedAccount.info, ...nameInfo }; + } if (isWhitelistedCreator) { setter( 'whitelistedCreatorsByCreator', diff --git a/js/packages/common/src/contexts/wallet.less b/js/packages/common/src/contexts/wallet.less index cd085414d24..a3dbc1c6308 100644 --- a/js/packages/common/src/contexts/wallet.less +++ b/js/packages/common/src/contexts/wallet.less @@ -4,3 +4,20 @@ p { font-style: normal; font-size: 0.9rem; } + +.ant-collapse-ghost > .ant-collapse-item > .ant-collapse-content > .ant-collapse-content-box { + padding: 0 8px; +} +.ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow { + vertical-align: middle !important; +} +.ant-collapse > .ant-collapse-item > .ant-collapse-header { + padding: 36px 8px 20px; +} +.ant-modal-content { + border-radius: 12px; +} +.phantom-button { + background: white !important; + color: black !important; +} diff --git a/js/packages/common/src/contexts/wallet.tsx b/js/packages/common/src/contexts/wallet.tsx index 513179e40c8..71c5b9e81c3 100644 --- a/js/packages/common/src/contexts/wallet.tsx +++ b/js/packages/common/src/contexts/wallet.tsx @@ -13,7 +13,7 @@ import { getTorusWallet, WalletName, } from '@solana/wallet-adapter-wallets'; -import { Button } from 'antd'; +import { Button, Collapse } from 'antd'; import React, { createContext, FC, @@ -27,6 +27,8 @@ import React, { import { notify } from '../utils'; import { MetaplexModal } from '../components'; +const { Panel } = Collapse; + export interface WalletModalContextState { visible: boolean; setVisible: (open: boolean) => void; @@ -49,95 +51,109 @@ export const WalletModal: FC = () => { setShowWallets(false); }, [setVisible, setShowWallets]); + const phatomWallet = useMemo(() => getPhantomWallet(), []); + return ( - -
+ - M -
- -

{selected ? 'Change provider' : 'Welcome to Metaplex'}

-

- {selected - ? 'Feel free to switch wallet provider' - : 'You must be signed in to place a bid'} -

- -
- {selected || showWallets ? ( - wallets.map(wallet => { - return ( - + + panelProps.isActive ? ( + + + + ) : ( + + + + ) + } + > + - {wallet.name} - - ); - }) - ) : ( - <> - -

setShowWallets(true)} - style={{ cursor: 'pointer', marginTop: 10 }} - > - Select a different Solana wallet -

- - )} + } + key="1" + > + {wallets.map((wallet, idx) => { + if (wallet.name === 'Phantom') return null; + + return ( + + ); + })} + + ); }; @@ -195,13 +211,13 @@ export const WalletProvider: FC<{ children: ReactNode }> = ({ children }) => { () => [ getPhantomWallet(), getSolflareWallet(), - getTorusWallet({ - options: { - // @FIXME: this should be changed for Metaplex, and by each Metaplex storefront - clientId: - 'BOM5Cl7PXgE9Ylq1Z1tqzhpydY0RVr8k90QQ85N7AKI5QGSrr9iDC-3rvmy0K_hF0JfpLMiXoDhta68JwcxS1LQ', - }, - }), + // getTorusWallet({ + // options: { + // // @FIXME: this should be changed for Metaplex, and by each Metaplex storefront + // clientId: + // 'BOM5Cl7PXgE9Ylq1Z1tqzhpydY0RVr8k90QQ85N7AKI5QGSrr9iDC-3rvmy0K_hF0JfpLMiXoDhta68JwcxS1LQ', + // }, + // }), getLedgerWallet(), getSolongWallet(), getMathWallet(), diff --git a/js/packages/common/src/models/metaplex/index.ts b/js/packages/common/src/models/metaplex/index.ts index 12603aca238..5facb7dd913 100644 --- a/js/packages/common/src/models/metaplex/index.ts +++ b/js/packages/common/src/models/metaplex/index.ts @@ -594,6 +594,7 @@ export class WhitelistedCreator { name?: string; image?: string; description?: string; + background?: string; constructor(args: { address: string; activated: boolean }) { this.address = args.address; diff --git a/js/packages/common/tsconfig.json b/js/packages/common/tsconfig.json index 4d65d0b5fa0..3e5281a10d5 100644 --- a/js/packages/common/tsconfig.json +++ b/js/packages/common/tsconfig.json @@ -18,6 +18,7 @@ "forceConsistentCasingInFileNames": true, "typeRoots": ["types", "../../types", "../../node_modules/@types"] }, + "files": ["src/config/userNames.json"], "include": ["src/**/*"], "exclude": ["src/**/*.test.ts", "**/node_modules"] } diff --git a/js/packages/fair-launch/src/fair-launch.ts b/js/packages/fair-launch/src/fair-launch.ts index eeac85d8bfe..3298f735e1a 100644 --- a/js/packages/fair-launch/src/fair-launch.ts +++ b/js/packages/fair-launch/src/fair-launch.ts @@ -188,8 +188,9 @@ export const punchTicket = async ( const ticket = fairLaunch.ticket.data; - const fairLaunchLotteryBitmap = //@ts-ignore - (await getFairLaunchLotteryBitmap(fairLaunch.state.tokenMint))[0]; + const fairLaunchLotteryBitmap = ( //@ts-ignore + await getFairLaunchLotteryBitmap(fairLaunch.state.tokenMint) + )[0]; const buyerTokenAccount = ( await getAtaForMint( @@ -519,9 +520,8 @@ export const purchaseTicket = async ( ); if (ticket) { - const fairLaunchLotteryBitmap = ( //@ts-ignore - await getFairLaunchLotteryBitmap(fairLaunch.state.tokenMint) - )[0]; + const fairLaunchLotteryBitmap = //@ts-ignore + (await getFairLaunchLotteryBitmap(fairLaunch.state.tokenMint))[0]; console.log( 'Anchor wallet', anchorWallet.publicKey.toBase58(), diff --git a/js/packages/web/package.json b/js/packages/web/package.json index 0061b858562..939c1380ae8 100644 --- a/js/packages/web/package.json +++ b/js/packages/web/package.json @@ -6,6 +6,7 @@ "@babel/preset-typescript": "^7.12.13", "@cloudflare/stream-react": "^1.1.0", "@google/model-viewer": "^1.7.2", + "@magic-ext/solana": "^0.2.0", "@oyster/common": "0.0.2", "@project-serum/serum": "^0.13.52", "@solana/spl-name-service": "0.1.3", @@ -15,16 +16,20 @@ "@solana/wallet-adapter-react": "^0.7.1", "@solana/web3.js": "^1.21.0", "@welldone-software/why-did-you-render": "^6.0.5", + "async-sema": "^3.1.1", "bn.js": "^5.1.3", "borsh": "^0.4.0", "bs58": "^4.0.1", "buffer-layout": "^1.2.0", "canvas-confetti": "^1.4.0", "chart.js": "^3.5.0", + "event-emitter": "^0.3.5", "eventemitter3": "^4.0.7", + "isomorphic-unfetch": "^3.1.0", "less": "^4.1.1", "less-loader": "^10.0.1", "lodash": "^4.17.20", + "magic-sdk": "^5.1.0", "next": "^11.0.1", "next-compose-plugins": "^2.2.1", "next-with-less": "^1.0.0", @@ -36,7 +41,8 @@ "react-masonry-css": "^1.0.16", "react-router-dom": "^5.2.0", "react-virtualized": "^9.22.3", - "three": "^0.128.0" + "three": "^0.128.0", + "timeago.js": "^4.0.2" }, "scripts": { "prestart": "npm-link-shared ../common/node_modules/ . react", diff --git a/js/packages/web/public/background-artists.png b/js/packages/web/public/background-artists.png new file mode 100644 index 00000000000..835b5f6ecc6 Binary files /dev/null and b/js/packages/web/public/background-artists.png differ diff --git a/js/packages/web/public/bell.svg b/js/packages/web/public/bell.svg new file mode 100644 index 00000000000..fcae90e4e7d --- /dev/null +++ b/js/packages/web/public/bell.svg @@ -0,0 +1,4 @@ + + + + diff --git a/js/packages/web/public/cog.svg b/js/packages/web/public/cog.svg new file mode 100644 index 00000000000..a7e84ac26cc --- /dev/null +++ b/js/packages/web/public/cog.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/js/packages/web/public/main-banner.png b/js/packages/web/public/main-banner.png new file mode 100644 index 00000000000..fcc30d091b7 Binary files /dev/null and b/js/packages/web/public/main-banner.png differ diff --git a/js/packages/web/public/main-banner.svg b/js/packages/web/public/main-banner.svg new file mode 100644 index 00000000000..46474ada074 --- /dev/null +++ b/js/packages/web/public/main-banner.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/js/packages/web/public/metaplex-logo.svg b/js/packages/web/public/metaplex-logo.svg new file mode 100644 index 00000000000..46474ada074 --- /dev/null +++ b/js/packages/web/public/metaplex-logo.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/js/packages/web/public/modals/close.svg b/js/packages/web/public/modals/close.svg new file mode 100644 index 00000000000..6aefe5bc9cd --- /dev/null +++ b/js/packages/web/public/modals/close.svg @@ -0,0 +1,22 @@ + + + + \ No newline at end of file diff --git a/js/packages/web/public/modals/how-auctions-work-1.jpg b/js/packages/web/public/modals/how-auctions-work-1.jpg new file mode 100755 index 00000000000..f434941f1e4 Binary files /dev/null and b/js/packages/web/public/modals/how-auctions-work-1.jpg differ diff --git a/js/packages/web/public/modals/how-auctions-work-2.jpg b/js/packages/web/public/modals/how-auctions-work-2.jpg new file mode 100755 index 00000000000..3581a00ff6a Binary files /dev/null and b/js/packages/web/public/modals/how-auctions-work-2.jpg differ diff --git a/js/packages/web/public/modals/how-auctions-work-3.jpg b/js/packages/web/public/modals/how-auctions-work-3.jpg new file mode 100755 index 00000000000..98efcd8a871 Binary files /dev/null and b/js/packages/web/public/modals/how-auctions-work-3.jpg differ diff --git a/js/packages/web/public/modals/how-to-buy-1.svg b/js/packages/web/public/modals/how-to-buy-1.svg new file mode 100644 index 00000000000..32c79c42bf2 --- /dev/null +++ b/js/packages/web/public/modals/how-to-buy-1.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/js/packages/web/public/modals/how-to-buy-2.svg b/js/packages/web/public/modals/how-to-buy-2.svg new file mode 100644 index 00000000000..53dc28122b1 --- /dev/null +++ b/js/packages/web/public/modals/how-to-buy-2.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/js/packages/web/public/modals/how-to-buy-3.jpg b/js/packages/web/public/modals/how-to-buy-3.jpg new file mode 100644 index 00000000000..797c4b4d205 Binary files /dev/null and b/js/packages/web/public/modals/how-to-buy-3.jpg differ diff --git a/js/packages/web/public/preLaunch/check.svg b/js/packages/web/public/preLaunch/check.svg new file mode 100644 index 00000000000..049ec14d309 --- /dev/null +++ b/js/packages/web/public/preLaunch/check.svg @@ -0,0 +1,3 @@ + + + diff --git a/js/packages/web/public/preLaunch/discord.png b/js/packages/web/public/preLaunch/discord.png new file mode 100644 index 00000000000..0aae00f10e8 Binary files /dev/null and b/js/packages/web/public/preLaunch/discord.png differ diff --git a/js/packages/web/public/preLaunch/discord.svg b/js/packages/web/public/preLaunch/discord.svg new file mode 100644 index 00000000000..f5e4c6fb251 --- /dev/null +++ b/js/packages/web/public/preLaunch/discord.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/js/packages/web/public/preLaunch/mail.svg b/js/packages/web/public/preLaunch/mail.svg new file mode 100644 index 00000000000..56cd502ec81 --- /dev/null +++ b/js/packages/web/public/preLaunch/mail.svg @@ -0,0 +1,4 @@ + + + + diff --git a/js/packages/web/public/preLaunch/step1.png b/js/packages/web/public/preLaunch/step1.png new file mode 100644 index 00000000000..418eaf8270e Binary files /dev/null and b/js/packages/web/public/preLaunch/step1.png differ diff --git a/js/packages/web/public/preLaunch/step2.png b/js/packages/web/public/preLaunch/step2.png new file mode 100644 index 00000000000..a8c3fa01f90 Binary files /dev/null and b/js/packages/web/public/preLaunch/step2.png differ diff --git a/js/packages/web/public/preLaunch/step3.png b/js/packages/web/public/preLaunch/step3.png new file mode 100644 index 00000000000..96d2870489b Binary files /dev/null and b/js/packages/web/public/preLaunch/step3.png differ diff --git a/js/packages/web/public/preLaunch/wallet.svg b/js/packages/web/public/preLaunch/wallet.svg new file mode 100644 index 00000000000..769be04d61a --- /dev/null +++ b/js/packages/web/public/preLaunch/wallet.svg @@ -0,0 +1,3 @@ + + + diff --git a/js/packages/web/public/sol-circle.svg b/js/packages/web/public/sol-circle.svg new file mode 100644 index 00000000000..a2990fb07cd --- /dev/null +++ b/js/packages/web/public/sol-circle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/js/packages/web/src/App.tsx b/js/packages/web/src/App.tsx index de7a4a7b018..06064b7404a 100644 --- a/js/packages/web/src/App.tsx +++ b/js/packages/web/src/App.tsx @@ -1,5 +1,6 @@ import React from 'react'; import { Routes } from './routes'; +// import { Routes } from './views/preLaunch/routes' function App() { return ; diff --git a/js/packages/web/src/actions/nft.tsx b/js/packages/web/src/actions/nft.tsx index 35e071c0e63..8e3ee45155f 100644 --- a/js/packages/web/src/actions/nft.tsx +++ b/js/packages/web/src/actions/nft.tsx @@ -121,7 +121,7 @@ export const mintNFT = async ( const { instructions: pushInstructions, signers: pushSigners } = await prepPayForFilesTxn(wallet, realFiles, metadata); - progressCallback(1) + progressCallback(1); const TOKEN_PROGRAM_ID = programIds().token; @@ -186,7 +186,7 @@ export const mintNFT = async ( instructions, wallet.publicKey.toBase58(), ); - progressCallback(2) + progressCallback(2); // TODO: enable when using payer account to avoid 2nd popup // const block = await connection.getRecentBlockhash('singleGossip'); @@ -198,7 +198,6 @@ export const mintNFT = async ( // }), // ); - const { txid } = await sendTransactionWithRetry( connection, wallet, @@ -206,11 +205,11 @@ export const mintNFT = async ( signers, 'single', ); - progressCallback(3) + progressCallback(3); try { await connection.confirmTransaction(txid, 'max'); - progressCallback(4) + progressCallback(4); } catch { // ignore } @@ -219,7 +218,7 @@ export const mintNFT = async ( // await connection.confirmTransaction(txid, 'max'); await connection.getParsedConfirmedTransaction(txid, 'confirmed'); - progressCallback(5) + progressCallback(5); // this means we're done getting AR txn setup. Ship it off to ARWeave! const data = new FormData(); @@ -239,7 +238,7 @@ export const mintNFT = async ( // TODO: convert to absolute file name for image const result: IArweaveResult = await uploadToArweave(data); - progressCallback(6) + progressCallback(6); const metadataFile = result.messages?.find( m => m.filename === RESERVED_TXN_MANIFEST, @@ -277,7 +276,7 @@ export const mintNFT = async ( ), ); - progressCallback(7) + progressCallback(7); // // In this instruction, mint authority will be removed from the main mint, while // // minting authority will be maintained for the Printing mint (which we want.) await createMasterEdition( @@ -309,7 +308,7 @@ export const mintNFT = async ( // updateInstructions, // ); - progressCallback(8) + progressCallback(8); const txid = await sendTransactionWithRetry( connection, @@ -357,8 +356,8 @@ export const prepPayForFilesTxn = async ( SystemProgram.transfer({ fromPubkey: wallet.publicKey, toPubkey: AR_SOL_HOLDER_ID, - lamports: 2300000 // 0.0023 SOL per file (paid to arweave) - // await getAssetCostToStore(files), + lamports: 2300000, // 0.0023 SOL per file (paid to arweave) + // await getAssetCostToStore(files), }), ); diff --git a/js/packages/web/src/components/AmountLabel/index.less b/js/packages/web/src/components/AmountLabel/index.less index b7bd7e2b866..5a378812557 100644 --- a/js/packages/web/src/components/AmountLabel/index.less +++ b/js/packages/web/src/components/AmountLabel/index.less @@ -1,6 +1,19 @@ +.display-sol { + font-weight: 600; + margin-left: 2px; +} .usd { - margin: 'auto 0'; - color: 'rgba(255, 255, 255, 0.4)'; - font-size: '1.5rem'; -} \ No newline at end of file + display: flex; + font-size: 14px; + line-height: 14px; + margin-left: 3px; + justify-content: flex-end; + flex-flow: column; + padding-bottom: 8px; + opacity: 0.7; +} +.bid-info .create-statistic .ant-statistic-title { + font-size: 14px; + line-height: 14px; +} diff --git a/js/packages/web/src/components/AmountLabel/index.tsx b/js/packages/web/src/components/AmountLabel/index.tsx index 3e0021fde18..d57c327b442 100644 --- a/js/packages/web/src/components/AmountLabel/index.tsx +++ b/js/packages/web/src/components/AmountLabel/index.tsx @@ -2,13 +2,17 @@ import React, { useEffect, useState } from 'react'; import { Statistic } from 'antd'; import { useSolPrice } from '../../contexts'; import { formatUSD } from '@oyster/common'; +import { SolCircle } from '../Custom'; interface IAmountLabel { amount: number | string; displayUSD?: boolean; + displaySOL?: boolean; title?: string; style?: object; containerStyle?: object; + iconSize?: number; + customPrefix?: JSX.Element; ended?: boolean; } @@ -16,9 +20,12 @@ export const AmountLabel = (props: IAmountLabel) => { const { amount: _amount, displayUSD = true, + displaySOL = false, title = '', style = {}, containerStyle = {}, + iconSize = 38, + customPrefix, ended, } = props; const amount = typeof _amount === 'string' ? parseFloat(_amount) : _amount; @@ -40,8 +47,8 @@ export const AmountLabel = (props: IAmountLabel) => { style={style} className="create-statistic" title={title || ''} - value={amount} - prefix="◎" + value={`${amount}${displaySOL ? ' SOL' : ''}`} + prefix={customPrefix || } /> )} {displayUSD && ( diff --git a/js/packages/web/src/components/AppBar/index.less b/js/packages/web/src/components/AppBar/index.less index 579d6003630..66165f2bd24 100644 --- a/js/packages/web/src/components/AppBar/index.less +++ b/js/packages/web/src/components/AppBar/index.less @@ -1,21 +1,11 @@ .App-Bar { padding: 0px; justify-content: space-between !important; -} - -.app-bar-box { - background: #121212; - box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3); - border-radius: 8px; - display: flex; - flex-direction: row; - align-items: center; - // padding: 8px 10px; - height: 56px; -} -.app-left { - padding: 8px 10px; + button.ant-btn:not(.connector) { + height: 32px; + background: none; + } } .title { @@ -39,7 +29,9 @@ height: 40px; margin-right: 14px; } - +.wallet-wrapper { + padding-right: 0.7rem; +} .app-btn { font-style: normal; font-weight: normal; diff --git a/js/packages/web/src/components/AppBar/index.tsx b/js/packages/web/src/components/AppBar/index.tsx index 7c0096540e6..2dca4e44274 100644 --- a/js/packages/web/src/components/AppBar/index.tsx +++ b/js/packages/web/src/components/AppBar/index.tsx @@ -1,46 +1,30 @@ -import React, { useMemo } from 'react'; +import React, { useState } from 'react'; import { Link } from 'react-router-dom'; -import { Button, Dropdown, Menu } from 'antd'; -import { ConnectButton, CurrentUserBadge } from '@oyster/common'; +import { Button, Menu, Modal } from 'antd'; import { useWallet } from '@solana/wallet-adapter-react'; import { Notifications } from '../Notifications'; import useWindowDimensions from '../../utils/layout'; import { MenuOutlined } from '@ant-design/icons'; -import { useMeta } from '../../contexts'; +import { HowToBuyModal } from '../HowToBuyModal'; +import { + Cog, + CurrentUserBadge, + CurrentUserBadgeMobile, +} from '../CurrentUserBadge'; +import { ConnectButton } from '@oyster/common'; -const UserActions = () => { - const { publicKey } = useWallet(); - const { whitelistedCreatorsByCreator, store } = useMeta(); - const pubkey = publicKey?.toBase58() || ''; - - const canCreate = useMemo(() => { - return ( - store?.info?.public || - whitelistedCreatorsByCreator[pubkey]?.info?.activated - ); - }, [pubkey, whitelistedCreatorsByCreator, store]); - - return ( - <> - {store && ( - <> - {/* - - */} - {canCreate ? ( - - - - ) : null} - - - - - )} - - ); +const getDefaultLinkActions = (connected: boolean) => { + return [ + + + , + + + , + + + , + ]; }; const DefaultActions = ({ vertical = false }: { vertical?: boolean }) => { @@ -52,84 +36,118 @@ const DefaultActions = ({ vertical = false }: { vertical?: boolean }) => { flexDirection: vertical ? 'column' : 'row', }} > - - - - - - - - - + {getDefaultLinkActions(connected)} ); }; const MetaplexMenu = () => { const { width } = useWindowDimensions(); + const [isModalVisible, setIsModalVisible] = useState(false); const { connected } = useWallet(); if (width < 768) return ( <> - - - - - - - - - - - - - - - - - + } + visible={isModalVisible} + footer={null} + className={'modal-box'} + closeIcon={ + setIsModalVisible(false)} + src={'/modals/close.svg'} + /> } > - - +
+ setIsModalVisible(false)}> + {getDefaultLinkActions(connected).map((item, idx) => ( + {item} + ))} + +
+ {!connected ? ( +
+ setIsModalVisible(false)} + className="secondary-btn" + /> + setIsModalVisible(false)} + buttonClassName="black-btn" + /> +
+ ) : ( + <> + { + setIsModalVisible(false); + }} + /> + + + + )} +
+
+ + setIsModalVisible(true)} + style={{ fontSize: '1.4rem' }} + /> ); return ; }; +export const LogoLink = () => { + return ( + + + + ); +}; + export const AppBar = () => { const { connected } = useWallet(); - return ( <> -
- {window.location.hash !== '#/analytics' && } -
+
+
- {connected ? ( -
- - +
+
+ +     +
- ) : ( - - )} +
+ {!connected && ( + + )} + {!connected && ( + + )} + {connected && ( + <> + + + + + )} +
+
); }; diff --git a/js/packages/web/src/components/ArtContent/index.tsx b/js/packages/web/src/components/ArtContent/index.tsx index 4b8c87b3830..949c1c170b8 100644 --- a/js/packages/web/src/components/ArtContent/index.tsx +++ b/js/packages/web/src/components/ArtContent/index.tsx @@ -33,7 +33,7 @@ const MeshArtContent = ({ uri={uri} className={className} preview={false} - style={{ width: 300, ...style }} + style={{ width: '100%', ...style }} /> ); } @@ -112,7 +112,7 @@ const VideoArtContent = ({ const content = likelyVideo && - likelyVideo.startsWith('https://watch.videodelivery.net/') ? ( + likelyVideo.startsWith('https://watch.videodelivery.net/') ? (
playerRef(e)} @@ -175,28 +175,32 @@ const HTMLContent = ({ files?: (MetadataFile | string)[]; artView?: boolean; }) => { - if (!artView){ - return + if (!artView) { + return ( + + ); } const htmlURL = files && files.length > 0 && typeof files[0] === 'string' ? files[0] : animationUrl; return ( - ); + style={style} + > + ); }; - export const ArtContent = ({ category, className, @@ -272,7 +276,7 @@ export const ArtContent = ({ animationURL={animationURL} active={active} /> - ) : (category === 'html' || animationUrlExt === 'html') ? ( + ) : category === 'html' || animationUrlExt === 'html' ? ( { paddingTop: 30, marginBottom: 4, }} - label={

Mint to

} + label={

Mint to

} labelAlign="left" colon={false} validateStatus={mintingDestinationErr ? 'error' : 'success'} @@ -191,7 +191,9 @@ export const ArtMinting = ({ id, onMint }: ArtMintingProps) => { flexDirection: 'column', paddingTop: 30, }} - label={

Number of editions to mint

} + label={ +

Number of editions to mint

+ } labelAlign="left" colon={false} > diff --git a/js/packages/web/src/components/ArtistAlleyForm/index.less b/js/packages/web/src/components/ArtistAlleyForm/index.less new file mode 100644 index 00000000000..e82ff7e4c08 --- /dev/null +++ b/js/packages/web/src/components/ArtistAlleyForm/index.less @@ -0,0 +1,57 @@ +@background-input-content: #282828; + +.artist-alley-container { + display: flex; + flex-direction: column; + max-width: 100%; + + .title { + position: relative; + font-weight: 600; + font-size: 32px; + line-height: 38px; + margin-bottom: 52px; + margin-top: 65px; + left: 20%; + max-width: 60%; + } + + .artist-alley-form { + position: relative; + display: inline-block; + left: 20%; + max-width: 60%; + + .input-content { + flex: auto; + max-width: 100%; + background-color: @background-input-content; + border-radius: 8px; + } + + .ant-form-item .ant-upload.ant-upload-drag { + background: rgba(255, 255, 255, 0.04); + height: 100px; + } + + .dragger-container { + background-color: @background-input-content; + border-radius: 8px; + height:100px; + + + .ant-upload-text { + font-weight: 500; + font-size: 18px; + line-height: 22px; + } + } + + .form-button { + width: 100%; + } + } +} + + + diff --git a/js/packages/web/src/components/ArtistAlleyForm/index.tsx b/js/packages/web/src/components/ArtistAlleyForm/index.tsx new file mode 100644 index 00000000000..e7a1fb655b8 --- /dev/null +++ b/js/packages/web/src/components/ArtistAlleyForm/index.tsx @@ -0,0 +1,92 @@ +import React from 'react'; +import { Form, Input, Button, Upload } from 'antd'; + +export const ArtistAlleyForm = () => { + const { TextArea } = Input; + + const onFinish = (values: any) => {}; + + const handleFile = (e: any) => { + if (Array.isArray(e)) { + return e; + } + return e && e.fileList; + }; + + return ( +
+
+ {' '} + Submit your original artwork to be featured by Todd MacFarlane +
+
+ + + + + + + + + + + + + + + +

Upload files here

+

+ Drag and drop, or click to browse +

+ + + + + +