Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
sagemathinc
GitHub Repository: sagemathinc/cocalc
 Path: blob/master/src/packages/next/pages/vouchers/index.tsx
1450 views
1
/*

2
 *  This file is part of CoCalc: Copyright © 2022 Sagemath, Inc.

3
 *  License: MS-RSL – see LICENSE.md for details

4
 */

5


6
import { Layout } from "antd";

7
import Header from "components/landing/header";

8
import Head from "components/landing/head";

9
import { Icon } from "@cocalc/frontend/components/icon";

10
import A from "components/misc/A";

11
import SiteName from "components/share/site-name";

12
import {

13
  OverviewRow,

14
  OVERVIEW_LARGE_ICON,

15
  OVERVIEW_STYLE,

16
  Product,

17
} from "lib/styles/layouts";

18
import withCustomize from "lib/with-customize";

19
import { Customize } from "lib/customize";

20
import useProfile from "lib/hooks/profile";

21


22
export default function Overview({ customize }) {

23
  const profile = useProfile();

24
  return (

25
    <Customize value={customize}>

26
      <Head title="Voucher Center" />

27
      <Layout>

28
        <Header />

29
        <Layout.Content style={{ background: "white" }}>

30
          <div style={OVERVIEW_STYLE}>

31
            <Icon style={OVERVIEW_LARGE_ICON} name="gift" />

32
            <h2 style={{ marginBottom: "30px" }}>

33
              Welcome to the <SiteName /> Voucher Center!

34
            </h2>

35
            <div style={{ fontSize: "12pt" }}>

36
              <div style={{ maxWidth: "700px", margin: "auto" }}>

37
                <A href="https://doc.cocalc.com/vouchers.html">Vouchers</A> are

38
                like a digital gift card, which can be used to purchase anything

39
                on <SiteName />.

40
              </div>

41
            </div>

42
            <OverviewRow>

43
              <Product

44
                href={"/store/vouchers"}

45
                icon="shopping-cart"

46
                title="Buy Vouchers"

47
              >

48
                Create voucher codes that you can share, resell, or use later.

49
              </Product>

50
              <Product icon="gift2" title="Redeem a Voucher" href="/redeem">

51
                Redeem a voucher code to add{" "}

52
                <A href="/settings/purchases">money</A> to your account.

53
              </Product>

54
              <Product

55
                icon="table"

56
                title="Vouchers You Redeemed"

57
                href="/vouchers/redeemed"

58
              >

59
                See a list of all vouchers you have redeemed.

60
              </Product>

61
              <Product

62
                href={"/vouchers/created"}

63
                icon="csv"

64
                title="Your Vouchers"

65
              >

66
                Browse all vouchers you have created and see their status.

67
              </Product>

68
            </OverviewRow>

69
            {profile?.is_admin && (

70
              <div

71
                style={{

72
                  display: "flex",

73
                  justifyContent: "center",

74
                  marginBottom: "30px",

75
                }}

76
              >

77
                <Product

78
                  href={"/vouchers/admin"}

79
                  icon="users"

80
                  title="Admin -- Voucher Payment Status"

81
                >

82
                  See the status of all vouchers that users have created.{" "}

83
                  <b>This page is only available to site admins.</b>

84
                </Product>

85
              </div>

86
            )}

87
          </div>

88
        </Layout.Content>

89
      </Layout>

90
    </Customize>

91
  );

92
}

93


94
export async function getServerSideProps(context) {

95
  return await withCustomize({ context });

96
}

97


98