utils#buildUrl TypeScript Examples

The following examples show how to use utils#buildUrl. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.

Example #1

Source File: bazaar-history.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.BAZAAR_HISTORY)

Example #2

Source File: index.tsx From exevo-pan with The Unlicense

5 votes

export default function PostPage({ initialPosts }: Props) {
  const { translations } = useTranslations()

  const TITLE = translations.blog.Meta.title
  const DESCRIPTION = translations.blog.Meta.description

  return (
    <>
      <Head>
        <title>{TITLE} - Exevo Pan</title>
        <meta name="title" content={TITLE} />
        <meta property="og:title" content={TITLE} />
        <meta property="twitter:title" content={TITLE} />

        <meta name="description" content={DESCRIPTION} />
        <meta property="twitter:description" content={DESCRIPTION} />
        <meta property="og:description" content={DESCRIPTION} />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.BLOG, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.BLOG, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.BLOG, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <Home
          initialIndex={DEFAULT_PAGINATION_OPTIONS.pageIndex + 1}
          initialPosts={initialPosts}
        />
      </Main>
    </>
  )
}

Example #3

Source File: index.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.BLOG)

Example #4

Source File: highlight-auction.tsx From exevo-pan with The Unlicense

5 votes

export default function Advertise({
  initialAuctionData,
}: AdvertiseStaticProps) {
  const { translations } = useTranslations()

  const { page, ...pageData } = initialAuctionData

  return (
    <>
      <Head>
        <title>{translations.advertise.Meta.title}</title>
        <meta name="title" content={translations.advertise.Meta.title} />
        <meta property="og:title" content={translations.advertise.Meta.title} />
        <meta
          property="twitter:title"
          content={translations.advertise.Meta.title}
        />

        <meta
          name="description"
          content={translations.advertise.Meta.description}
        />
        <meta
          property="twitter:description"
          content={translations.advertise.Meta.description}
        />
        <meta
          property="og:description"
          content={translations.advertise.Meta.description}
        />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.ADVERTISE, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.ADVERTISE, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.ADVERTISE, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <AuctionsProvider initialPage={page} initialPageData={pageData}>
          <AdvertiseGrid />
        </AuctionsProvider>
      </Main>
    </>
  )
}

Example #5

Source File: highlight-auction.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.ADVERTISE)

Example #6

Source File: index.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.HOME)

Example #7

Source File: highscores.tsx From exevo-pan with The Unlicense

5 votes

export default function Highscores({
  statisticsData,
}: {
  statisticsData: StatisticsData
}) {
  const { translations } = useTranslations()

  return (
    <>
      <Head>
        <title>{translations.statistics.Meta.Highscores.title}</title>
        <meta
          name="title"
          content={translations.statistics.Meta.Highscores.title}
        />
        <meta
          property="og:title"
          content={translations.statistics.Meta.Highscores.title}
        />
        <meta
          property="twitter:title"
          content={translations.statistics.Meta.Highscores.title}
        />

        <meta
          name="description"
          content={translations.statistics.Meta.Highscores.description}
        />
        <meta
          property="twitter:description"
          content={translations.statistics.Meta.Highscores.description}
        />
        <meta
          property="og:description"
          content={translations.statistics.Meta.Highscores.description}
        />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.HIGHSCORES, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.HIGHSCORES, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.HIGHSCORES, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <main>
          <Header />
          <HighscoresGrid statisticsData={statisticsData} />
        </main>
      </Main>
    </>
  )
}

Example #8

Source File: highscores.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.HIGHSCORES)

Example #9

Source File: index.tsx From exevo-pan with The Unlicense

5 votes

export default function Statistics({
  statisticsData,
}: {
  statisticsData: StatisticsData
}) {
  const { translations } = useTranslations()

  return (
    <>
      <Head>
        <title>{translations.statistics.Meta.Statistics.title}</title>
        <meta
          name="title"
          content={translations.statistics.Meta.Statistics.title}
        />
        <meta
          property="og:title"
          content={translations.statistics.Meta.Statistics.title}
        />
        <meta
          property="twitter:title"
          content={translations.statistics.Meta.Statistics.title}
        />

        <meta
          name="description"
          content={translations.statistics.Meta.Statistics.description}
        />
        <meta
          property="twitter:description"
          content={translations.statistics.Meta.Statistics.description}
        />
        <meta
          property="og:description"
          content={translations.statistics.Meta.Statistics.description}
        />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.STATISTICS, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.STATISTICS, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.STATISTICS, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <main>
          <Header />
          <OverallGrid statisticsData={statisticsData} />
        </main>
      </Main>
    </>
  )
}

Example #10

Source File: index.tsx From exevo-pan with The Unlicense

5 votes

pageUrl = buildUrl(routes.STATISTICS)

Example #11

Source File: bazaar-history.tsx From exevo-pan with The Unlicense

4 votes

export default function BazaarHistory({
  serverOptions,
  auctionedItemOptions,
  initialAuctionData,
  blogPosts,
}: HistoryStaticProps) {
  const { translations } = useTranslations()

  const { page, sortingMode, descendingOrder, ...pageData } = initialAuctionData

  return (
    <div>
      <Head>
        <title>{translations.bazaarHistory.Meta.title}</title>
        <meta name="title" content={translations.bazaarHistory.Meta.title} />
        <meta
          property="og:title"
          content={translations.bazaarHistory.Meta.title}
        />
        <meta
          property="twitter:title"
          content={translations.bazaarHistory.Meta.title}
        />

        <meta
          name="description"
          content={translations.bazaarHistory.Meta.description}
        />
        <meta
          property="twitter:description"
          content={translations.bazaarHistory.Meta.description}
        />
        <meta
          property="og:description"
          content={translations.bazaarHistory.Meta.description}
        />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.BAZAAR_HISTORY, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.BAZAAR_HISTORY, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.BAZAAR_HISTORY, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <Newsticker blogPosts={blogPosts} />
        <DrawerFieldsProvider
          serverOptions={serverOptions}
          auctionedItemOptions={auctionedItemOptions}
        >
          <FiltersProvider>
            <AuctionsProvider
              endpoint={endpoints.HISTORY_AUCTIONS}
              highlightedAuctions={[]}
              initialPage={page}
              initialPageData={pageData}
              defaultSortingMode={sortingMode}
              defaultDescendingOrder={descendingOrder}
            >
              <AuctionsGrid past />
            </AuctionsProvider>
          </FiltersProvider>
        </DrawerFieldsProvider>
      </Main>
    </div>
  )
}

Example #12

Source File: [slug].tsx From exevo-pan with The Unlicense

4 votes

export default function PostPage({
  mdxSource,
  metaData,
  recentPosts,
  locale,
}: Props) {
  const { translations } = useTranslations()

  const postRoute = `${routes.BLOG}/${metaData.slug}`
  const pageUrl = buildUrl(postRoute)

  const src = JSON.stringify(mdxSource)

  const titles = parseMarkdownSections(src)

  const [day, month, year] = metaData.date.toString().split('-')
  const tags = metaData.tags as unknown as string[]
  return (
    <>
      <Head>
        <title>{metaData.title} - Exevo Pan</title>
        <meta name="title" content={metaData.title} />
        <meta property="og:title" content={metaData.title} />
        <meta property="twitter:title" content={metaData.title} />

        <meta name="description" content={metaData.description} />
        <meta property="twitter:description" content={metaData.description} />
        <meta property="og:description" content={metaData.description} />
        {tags.map((tag) => (
          <meta
            key={tag}
            property="article:tag"
            content={translations.common.BlogTags[tag]}
          />
        ))}

        <meta property="og:type" content="article" />
        <meta
          property="article:author"
          content={metaData.author.name as string}
        />
        <meta
          property="article:published_time"
          content={`${year}-${month}-${day}`}
        />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <meta
          key="preview-1"
          property="og:image"
          content={metaData.thumbnail}
        />
        <meta
          key="preview-2"
          property="twitter:image"
          content={metaData.thumbnail}
        />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link rel="alternate" hrefLang="pt" href={buildUrl(postRoute, 'pt')} />
        <link rel="alternate" hrefLang="es" href={buildUrl(postRoute, 'es')} />
        <link rel="alternate" hrefLang="pl" href={buildUrl(postRoute, 'pl')} />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: JSON.stringify({
              '@context': 'http://schema.org',
              '@type': 'Article',
              url: buildUrl(postRoute, locale),
              image: metaData.thumbnail,
              headline: metaData.title,
              datePublished: `${year}-${month}-${day}`,
              keywords: tags
                .map((tag) => translations.common.BlogTags[tag])
                .join(', '),
              description: metaData.description,
              publisher: {
                '@context': 'http://schema.org',
                '@type': 'Organization',
                name: 'Exevo Pan',
                logo: {
                  '@context': 'http://schema.org',
                  '@type': 'ImageObject',
                  url: 'https://i.imgur.com/OEGEUK0.png',
                  width: '150',
                  height: '100',
                },
              },
              author: {
                '@context': 'http://schema.org',
                '@type': 'Person',
                name: metaData.author.name,
              },
              mainEntityOfPage: {
                '@type': 'WebPage',
                '@id': links.CANONICAL,
              },
            }),
          }}
        />

        <style
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: `
            html {
                scroll-padding-top: 104px;
            }
         `,
          }}
        />
      </Head>

      <Main>
        <article>
          <Post.Hero
            title={metaData.title}
            subtitle={`${
              translations.common.FullMonth[+month - 1]
            } ${day}, ${year}`}
            src={metaData.thumbnail}
          />

          <Post.Layout>
            <Post.Layout.Left>
              <Post.Breadcrumbs postTitle={metaData.title} />
              <Post.Pillar titles={titles} />
              <Post.Tags tags={tags} />
            </Post.Layout.Left>

            <Post.Layout.Center>
              <MDXRemote {...mdxSource} components={components} />
              <Post.Authors
                author={metaData.author}
                translator={metaData.translator}
              />
            </Post.Layout.Center>

            <Post.Layout.Right>
              <Post.Newsletter />
              <Post.PostGrid
                gridTitle={translations.blog.recentPosts}
                posts={recentPosts}
              />
            </Post.Layout.Right>
          </Post.Layout>
        </article>
      </Main>
    </>
  )
}

Example #13

Source File: index.tsx From exevo-pan with The Unlicense

4 votes

export default function Home({
  serverOptions,
  auctionedItemOptions,
  initialAuctionData,
  highlightedAuctions,
  blogPosts,
}: HomeStaticProps) {
  const { translations } = useTranslations()

  const { page, sortingMode, descendingOrder, ...pageData } = initialAuctionData

  return (
    <>
      <Head>
        <title>{translations.homepage.Meta.title}</title>
        <meta name="title" content={translations.homepage.Meta.title} />
        <meta property="og:title" content={translations.homepage.Meta.title} />
        <meta
          property="twitter:title"
          content={translations.homepage.Meta.title}
        />

        <meta
          name="description"
          content={translations.homepage.Meta.description}
        />
        <meta
          property="twitter:description"
          content={translations.homepage.Meta.description}
        />
        <meta
          property="og:description"
          content={translations.homepage.Meta.description}
        />
        <meta property="og:type" content="website" />

        <link rel="canonical" href={pageUrl} />
        <meta property="og:url" content={pageUrl} />
        <meta property="twitter:url" content={pageUrl} />

        <link rel="alternate" hrefLang="en" href={pageUrl} />
        <link
          rel="alternate"
          hrefLang="pt"
          href={buildUrl(routes.HOME, 'pt')}
        />
        <link
          rel="alternate"
          hrefLang="es"
          href={buildUrl(routes.HOME, 'es')}
        />
        <link
          rel="alternate"
          hrefLang="pl"
          href={buildUrl(routes.HOME, 'pl')}
        />
        <link rel="alternate" hrefLang="x-default" href={pageUrl} />

        <script
          type="application/ld+json"
          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{
            __html: jsonld.standard,
          }}
        />
      </Head>

      <Main>
        <Newsticker blogPosts={blogPosts} />
        <DrawerFieldsProvider
          serverOptions={serverOptions}
          auctionedItemOptions={auctionedItemOptions}
        >
          <FiltersProvider>
            <AuctionsProvider
              endpoint={endpoints.CURRENT_AUCTIONS}
              highlightedAuctions={highlightedAuctions}
              initialPage={page}
              initialPageData={pageData}
              defaultSortingMode={sortingMode}
              defaultDescendingOrder={descendingOrder}
            >
              <AuctionsGrid past={false} />
            </AuctionsProvider>
          </FiltersProvider>
        </DrawerFieldsProvider>
      </Main>
    </>
  )
}