ui/src/components/sponsors.tsx

   1 import { Component } from 'inferno';
   2 import { WebSocketService } from '../services';
   3 import { i18n } from '../i18next';
   4 import { T } from 'inferno-i18next';
   5 import { repoUrl } from '../utils';
   6
   7 interface SilverUser {
   8   name: string;
   9   link: string;
  10 }
  11
  12 let general = [
  13   'Forrest Weghorst',
  14   'Serge Tarkovski',
  15   'alexx henry',
  16   'Nathan J. Goode',
  17   'Andre Vallestero',
  18   'NotTooHighToHack',
  19 ];
  20 let highlighted = ['Oskenso Kashi', 'Alex Benishek'];
  21 let silver: Array<SilverUser> = [
  22   {
  23     name: 'Redjoker',
  24     link: 'https://redcard.iww.org/user/register',
  25   },
  26 ];
  27 // let gold = [];
  28 // let latinum = [];
  29
  30 export class Sponsors extends Component<any, any> {
  31   constructor(props: any, context: any) {
  32     super(props, context);
  33   }
  34
  35   componentDidMount() {
  36     document.title = `${i18n.t('sponsors')} - ${
  37       WebSocketService.Instance.site.name
  38     }`;
  39     window.scrollTo(0, 0);
  40   }
  41
  42   render() {
  43     return (
  44       <div class="container text-center">
  45         {this.topMessage()}
  46         <hr />
  47         {this.sponsors()}
  48         <hr />
  49         {this.bitcoin()}
  50       </div>
  51     );
  52   }
  53
  54   topMessage() {
  55     return (
  56       <div>
  57         <h5>{i18n.t('donate_to_lemmy')}</h5>
  58         <p>
  59           <T i18nKey="sponsor_message">
  60             #<a href={repoUrl}>#</a>
  61           </T>
  62         </p>
  63         <a class="btn btn-secondary" href="https://liberapay.com/Lemmy/">
  64           {i18n.t('support_on_liberapay')}
  65         </a>
  66         <a
  67           class="btn btn-secondary ml-2"
  68           href="https://www.patreon.com/dessalines"
  69         >
  70           {i18n.t('support_on_patreon')}
  71         </a>
  72         <a
  73           class="btn btn-secondary ml-2"
  74           href="https://opencollective.com/lemmy"
  75         >
  76           {i18n.t('support_on_open_collective')}
  77         </a>
  78       </div>
  79     );
  80   }
  81   sponsors() {
  82     return (
  83       <div class="container">
  84         <h5>{i18n.t('sponsors')}</h5>
  85         <p>{i18n.t('silver_sponsors')}</p>
  86         <div class="row card-columns">
  87           {silver.map(s => (
  88             <div class="card col-12 col-md-2">
  89               <div>
  90                 <a href={s.link} target="_blank">
  91                   💎 {s.name}
  92                 </a>
  93               </div>
  94             </div>
  95           ))}
  96         </div>
  97         <p>{i18n.t('general_sponsors')}</p>
  98         <div class="row card-columns">
  99           {highlighted.map(s => (
 100             <div class="card bg-primary col-12 col-md-2 font-weight-bold">
 101               <div>{s}</div>
 102             </div>
 103           ))}
 104           {general.map(s => (
 105             <div class="card col-12 col-md-2">
 106               <div>{s}</div>
 107             </div>
 108           ))}
 109         </div>
 110       </div>
 111     );
 112   }
 113
 114   bitcoin() {
 115     return (
 116       <div>
 117         <h5>{i18n.t('crypto')}</h5>
 118         <div class="table-responsive">
 119           <table class="table table-hover text-center">
 120             <tbody>
 121               <tr>
 122                 <td>{i18n.t('bitcoin')}</td>
 123                 <td>
 124                   <code>1Hefs7miXS5ff5Ck5xvmjKjXf5242KzRtK</code>
 125                 </td>
 126               </tr>
 127               <tr>
 128                 <td>{i18n.t('ethereum')}</td>
 129                 <td>
 130                   <code>0x400c96c96acbC6E7B3B43B1dc1BB446540a88A01</code>
 131                 </td>
 132               </tr>
 133               <tr>
 134                 <td>{i18n.t('monero')}</td>
 135                 <td>
 136                   <code>
 137                     41taVyY6e1xApqKyMVDRVxJ76sPkfZhALLTjRvVKpaAh2pBd4wv9RgYj1tSPrx8wc6iE1uWUfjtQdTmTy2FGMeChGVKPQuV
 138                   </code>
 139                 </td>
 140               </tr>
 141             </tbody>
 142           </table>
 143         </div>
 144       </div>
 145     );
 146   }
 147 }