diff options
author | Dessalines <tyhou13@gmx.com> | 2019-08-09 15:52:32 -0700 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2019-08-09 15:52:32 -0700 |
commit | 3060608a45bdbb2bd08f5a2ec95f4312ff2c98a7 (patch) | |
tree | 99a229642ee4b73c17a2adac3afc928f6279667a /ui | |
parent | 91a3d1439381e25955f84f70fd9ebb21fc6160ba (diff) |
Second front end pass.
Diffstat (limited to 'ui')
-rw-r--r-- | ui/src/components/comment-form.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/comment-node.tsx | 7 | ||||
-rw-r--r-- | ui/src/components/comment-nodes.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/communities.tsx | 11 | ||||
-rw-r--r-- | ui/src/components/community-form.tsx | 3 | ||||
-rw-r--r-- | ui/src/components/home.tsx | 0 | ||||
-rw-r--r-- | ui/src/components/inbox.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/login.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/main.tsx | 25 | ||||
-rw-r--r-- | ui/src/components/moment-time.tsx | 3 | ||||
-rw-r--r-- | ui/src/components/navbar.tsx | 1 | ||||
-rw-r--r-- | ui/src/components/post-listing.tsx | 4 | ||||
-rw-r--r-- | ui/src/components/search.tsx | 6 | ||||
-rw-r--r-- | ui/src/components/sidebar.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/sponsors.tsx | 2 | ||||
-rw-r--r-- | ui/src/components/user.tsx | 2 |
16 files changed, 36 insertions, 38 deletions
diff --git a/ui/src/components/comment-form.tsx b/ui/src/components/comment-form.tsx index 9f3476a8..ed62fcf5 100644 --- a/ui/src/components/comment-form.tsx +++ b/ui/src/components/comment-form.tsx @@ -88,7 +88,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> { if (i.props.node) { i.props.onReplyCancel(); } - + autosize.update(document.querySelector('textarea')); } diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx index a05286ed..a1ac93b3 100644 --- a/ui/src/components/comment-node.tsx +++ b/ui/src/components/comment-node.tsx @@ -195,10 +195,10 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { {/* TODO hold off on expires until later */} {/* <div class="form-group row"> */} {/* <label class="col-form-label">Expires</label> */} - {/* <input type="date" class="form-control mr-2" placeholder="Expires" value={this.state.banExpires} onInput={linkEvent(this, this.handleModBanExpiresChange)} /> */} + {/* <input type="date" class="form-control mr-2" placeholder={i18n.t('expires')} value={this.state.banExpires} onInput={linkEvent(this, this.handleModBanExpiresChange)} /> */} {/* </div> */} <div class="form-group row"> - <button type="submit" class="btn btn-secondary">Ban {this.props.node.comment.creator_name}</button> + <button type="submit" class="btn btn-secondary">{i18n.t('ban')} {this.props.node.comment.creator_name}</button> </div> </form> } @@ -389,9 +389,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { handleModBanBothSubmit(i: CommentNode) { event.preventDefault(); - console.log(BanType[i.state.banType]); - console.log(i.props.node.comment.banned); - if (i.state.banType == BanType.Community) { let form: BanFromCommunityForm = { user_id: i.props.node.comment.creator_id, diff --git a/ui/src/components/comment-nodes.tsx b/ui/src/components/comment-nodes.tsx index da67bbc7..fca323e3 100644 --- a/ui/src/components/comment-nodes.tsx +++ b/ui/src/components/comment-nodes.tsx @@ -32,7 +32,7 @@ export class CommentNodes extends Component<CommentNodesProps, CommentNodesState moderators={this.props.moderators} admins={this.props.admins} markable={this.props.markable} - /> + /> )} </div> ) diff --git a/ui/src/components/communities.tsx b/ui/src/components/communities.tsx index 066d524a..f10dd10d 100644 --- a/ui/src/components/communities.tsx +++ b/ui/src/components/communities.tsx @@ -5,6 +5,7 @@ import { retryWhen, delay, take } from 'rxjs/operators'; import { UserOperation, Community, ListCommunitiesResponse, CommunityResponse, FollowCommunityForm, ListCommunitiesForm, SortType } from '../interfaces'; import { WebSocketService } from '../services'; import { msgOp } from '../utils'; +import { i18n } from '../i18next'; import { T } from 'inferno-i18next'; declare const Sortable: any; @@ -27,12 +28,12 @@ export class Communities extends Component<any, CommunitiesState> { super(props, context); this.state = this.emptyState; this.subscription = WebSocketService.Instance.subject - .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) - .subscribe( - (msg) => this.parseMessage(msg), + .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) + .subscribe( + (msg) => this.parseMessage(msg), (err) => console.error(err), () => console.log('complete') - ); + ); this.refetch(); @@ -47,7 +48,7 @@ export class Communities extends Component<any, CommunitiesState> { } componentDidMount() { - document.title = `Communities - ${WebSocketService.Instance.site.name}`; + document.title = `${i18n.t('communities')} - ${WebSocketService.Instance.site.name}`; } // Necessary for back button for some reason diff --git a/ui/src/components/community-form.tsx b/ui/src/components/community-form.tsx index f6520fc6..5db2fcb6 100644 --- a/ui/src/components/community-form.tsx +++ b/ui/src/components/community-form.tsx @@ -171,8 +171,7 @@ export class CommunityForm extends Component<CommunityFormProps, CommunityFormSt this.state.loading = false; this.props.onCreate(res.community); } - - // TODO is this necessary? + // TODO is ths necessary else if (op == UserOperation.EditCommunity) { let res: CommunityResponse = msg; this.state.loading = false; diff --git a/ui/src/components/home.tsx b/ui/src/components/home.tsx deleted file mode 100644 index e69de29b..00000000 --- a/ui/src/components/home.tsx +++ /dev/null diff --git a/ui/src/components/inbox.tsx b/ui/src/components/inbox.tsx index 1b5b1b88..909fe447 100644 --- a/ui/src/components/inbox.tsx +++ b/ui/src/components/inbox.tsx @@ -90,7 +90,7 @@ export class Inbox extends Component<any, InboxState> { <select value={this.state.sort} onChange={linkEvent(this, this.handleSortChange)} class="custom-select custom-select-sm w-auto ml-2"> <option disabled><T i18nKey="sort_type">#</T></option> <option value={SortType.New}><T i18nKey="new">#</T></option> - <option value={SortType.TopDay}><T i18nKey="top_day">top_day</T></option> + <option value={SortType.TopDay}><T i18nKey="top_day">#</T></option> <option value={SortType.TopWeek}><T i18nKey="week">#</T></option> <option value={SortType.TopMonth}><T i18nKey="month">#</T></option> <option value={SortType.TopYear}><T i18nKey="year">#</T></option> diff --git a/ui/src/components/login.tsx b/ui/src/components/login.tsx index e5386aa9..8114be01 100644 --- a/ui/src/components/login.tsx +++ b/ui/src/components/login.tsx @@ -52,7 +52,7 @@ export class Login extends Component<any, State> { } componentDidMount() { - document.title = `Login - ${WebSocketService.Instance.site.name}`; + document.title = `${i18n.t('login')} - ${WebSocketService.Instance.site.name}`; } render() { diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx index c6d3808b..88f657c7 100644 --- a/ui/src/components/main.tsx +++ b/ui/src/components/main.tsx @@ -7,6 +7,7 @@ import { WebSocketService, UserService } from '../services'; import { PostListings } from './post-listings'; import { SiteForm } from './site-form'; import { msgOp, repoUrl, mdToHtml, fetchLimit, routeSortTypeToEnum, routeListingTypeToEnum } from '../utils'; +import { i18n } from '../i18next'; import { T } from 'inferno-i18next'; interface MainState { @@ -286,7 +287,7 @@ export class Main extends Component<any, MainState> { onChange={linkEvent(this, this.handleTypeChange)} disabled={UserService.Instance.user == undefined} /> - Subscribed + {i18n.t('subscribed')} </label> <label className={`pointer btn btn-sm btn-secondary ${this.state.type_ == ListingType.All && 'active'}`}> <input type="radio" @@ -294,19 +295,19 @@ export class Main extends Component<any, MainState> { checked={this.state.type_ == ListingType.All} onChange={linkEvent(this, this.handleTypeChange)} /> - All + {i18n.t('all')} </label> </div> <select value={this.state.sort} onChange={linkEvent(this, this.handleSortChange)} class="ml-2 custom-select custom-select-sm w-auto"> - <option disabled>Sort Type</option> - <option value={SortType.Hot}>Hot</option> - <option value={SortType.New}>New</option> + <option disabled><T i18nKey="sort_type">#</T></option> + <option value={SortType.Hot}><T i18nKey="hot">#</T></option> + <option value={SortType.New}><T i18nKey="new">#</T></option> <option disabled>──────────</option> - <option value={SortType.TopDay}>Top Day</option> - <option value={SortType.TopWeek}>Week</option> - <option value={SortType.TopMonth}>Month</option> - <option value={SortType.TopYear}>Year</option> - <option value={SortType.TopAll}>All</option> + <option value={SortType.TopDay}><T i18nKey="top_day">#</T></option> + <option value={SortType.TopWeek}><T i18nKey="week">#</T></option> + <option value={SortType.TopMonth}><T i18nKey="month">#</T></option> + <option value={SortType.TopYear}><T i18nKey="year">#</T></option> + <option value={SortType.TopAll}><T i18nKey="all">#</T></option> </select> </div> ) @@ -316,9 +317,9 @@ export class Main extends Component<any, MainState> { return ( <div class="mt-2"> {this.state.page > 1 && - <button class="btn btn-sm btn-secondary mr-1" onClick={linkEvent(this, this.prevPage)}>Prev</button> + <button class="btn btn-sm btn-secondary mr-1" onClick={linkEvent(this, this.prevPage)}><T i18nKey="prev">#</T></button> } - <button class="btn btn-sm btn-secondary" onClick={linkEvent(this, this.nextPage)}>Next</button> + <button class="btn btn-sm btn-secondary" onClick={linkEvent(this, this.nextPage)}><T i18nKey="next">#</T></button> </div> ); } diff --git a/ui/src/components/moment-time.tsx b/ui/src/components/moment-time.tsx index b35ceea8..021cf5f7 100644 --- a/ui/src/components/moment-time.tsx +++ b/ui/src/components/moment-time.tsx @@ -1,6 +1,6 @@ import { Component } from 'inferno'; import * as moment from 'moment'; -import 'moment/locale/de.js'; +// import 'moment/locale/de.js'; import { getLanguage } from '../utils'; import { i18n } from '../i18next'; @@ -16,7 +16,6 @@ export class MomentTime extends Component<MomentTimeProps, any> { constructor(props: any, context: any) { super(props, context); - // console.log(moment.locales()); moment.locale(getLanguage()); } diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx index ac23e361..5738483d 100644 --- a/ui/src/components/navbar.tsx +++ b/ui/src/components/navbar.tsx @@ -155,6 +155,7 @@ export class Navbar extends Component<any, NavbarState> { parseMessage(msg: any) { let op: UserOperation = msgOp(msg); if (msg.error) { + // TODO if (msg.error == "Not logged in.") { UserService.Instance.logout(); location.reload(); diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx index dc8f4cfa..ff70783c 100644 --- a/ui/src/components/post-listing.tsx +++ b/ui/src/components/post-listing.tsx @@ -76,7 +76,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> { <h5 className="mb-0 d-inline"> {post.url ? <a className="text-white" href={post.url} target="_blank" title={post.url}>{post.name}</a> : - <Link className="text-white" to={`/post/${post.id}`} title="Comments">{post.name}</Link> + <Link className="text-white" to={`/post/${post.id}`} title={i18n.t('comments')}>{post.name}</Link> } </h5> {post.url && @@ -176,7 +176,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> { } {this.state.showRemoveDialog && <form class="form-inline" onSubmit={linkEvent(this, this.handleModRemoveSubmit)}> - <input type="text" class="form-control mr-2" placeholder="Reason" value={this.state.removeReason} onInput={linkEvent(this, this.handleModRemoveReasonChange)} /> + <input type="text" class="form-control mr-2" placeholder={i18n.t('reason')} value={this.state.removeReason} onInput={linkEvent(this, this.handleModRemoveReasonChange)} /> <button type="submit" class="btn btn-secondary"><T i18nKey="remove_post">#</T></button> </form> } diff --git a/ui/src/components/search.tsx b/ui/src/components/search.tsx index 67202dba..ae29fd0b 100644 --- a/ui/src/components/search.tsx +++ b/ui/src/components/search.tsx @@ -54,7 +54,7 @@ export class Search extends Component<any, SearchState> { } componentDidMount() { - document.title = `Search - ${WebSocketService.Instance.site.name}`; + document.title = `${i18n.t('search')} - ${WebSocketService.Instance.site.name}`; } render() { @@ -62,7 +62,7 @@ export class Search extends Component<any, SearchState> { <div class="container"> <div class="row"> <div class="col-12"> - <h5>Search</h5> + <h5><T i18nKey="search">#</T></h5> {this.selects()} {this.searchForm()} {this.state.type_ == SearchType.Both && @@ -85,7 +85,7 @@ export class Search extends Component<any, SearchState> { searchForm() { return ( <form class="form-inline" onSubmit={linkEvent(this, this.handleSearchSubmit)}> - <input type="text" class="form-control mr-2" value={this.state.q} placeholder="Search..." onInput={linkEvent(this, this.handleQChange)} required minLength={3} /> + <input type="text" class="form-control mr-2" value={this.state.q} placeholder={`${i18n.t('search')}...`} onInput={linkEvent(this, this.handleQChange)} required minLength={3} /> <button type="submit" class="btn btn-secondary mr-2"> {this.state.loading ? <svg class="icon icon-spinner spin"><use xlinkHref="#icon-spinner"></use></svg> : diff --git a/ui/src/components/sidebar.tsx b/ui/src/components/sidebar.tsx index 900c5477..8d804343 100644 --- a/ui/src/components/sidebar.tsx +++ b/ui/src/components/sidebar.tsx @@ -97,7 +97,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> { {/* TODO hold off on expires for now */} {/* <div class="form-group row"> */} {/* <label class="col-form-label">Expires</label> */} - {/* <input type="date" class="form-control mr-2" placeholder="Expires" value={this.state.removeExpires} onInput={linkEvent(this, this.handleModRemoveExpiresChange)} /> */} + {/* <input type="date" class="form-control mr-2" placeholder={i18n.t('expires')} value={this.state.removeExpires} onInput={linkEvent(this, this.handleModRemoveExpiresChange)} /> */} {/* </div> */} <div class="form-group row"> <button type="submit" class="btn btn-secondary"><T i18nKey="remove_community">#</T></button> diff --git a/ui/src/components/sponsors.tsx b/ui/src/components/sponsors.tsx index 898efa2c..3fd55c2f 100644 --- a/ui/src/components/sponsors.tsx +++ b/ui/src/components/sponsors.tsx @@ -65,7 +65,7 @@ export class Sponsors extends Component<any, any> { bitcoin() { return ( <div> - <h5>Crypto</h5> + <h5><T i18nKey="crypto">#</T></h5> <div class="table-responsive"> <table class="table table-hover text-center"> <tbody> diff --git a/ui/src/components/user.tsx b/ui/src/components/user.tsx index 4193175c..f0034a47 100644 --- a/ui/src/components/user.tsx +++ b/ui/src/components/user.tsx @@ -219,7 +219,7 @@ export class User extends Component<any, UserState> { return ( <div> <h5>{user.name}</h5> - <div>Joined <MomentTime data={user} /></div> + <div>{i18n.t('joined')}<MomentTime data={user} /></div> <table class="table table-bordered table-sm mt-2"> <tr> <td><T i18nKey="number_of_points" interpolation={{count: user.post_score}}>#</T></td> |