Unfloyded/misskey-tools
0
0
Fork 0
Code Activity

wip

Browse source
This commit is contained in:
xeltica 2021-09-07 20:50:09 +09:00
parent d94f2c91fb
commit 17a12d127c
5 changed files with 78 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

93
src/frontend/components/SettingPage.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useReducer } from 'react';
import React, { useEffect, useMemo, useReducer } from 'react';
import { AlertMode } from '../../common/types/alert-mode';
import { IUser } from '../../common/types/user';
import { Visibility } from '../../common/types/visibility';
@ -42,52 +42,63 @@ export const SettingPage: React.VFC = () => {
}
}, [session.data]);
const saveButton = useMemo(() => (
<button className="btn primary" style={{alignSelf: 'flex-end'}}>
保存
</button>
), []);
return session.isLoading || !data ? (
<div className="skeleton" style={{width: '100%', height: '128px'}}></div>
) : (
<div className="vstack">
<div>
<label htmlFor="alertMode" className="input-field">スコア通知方法</label>
<select name="alertMode" className="input-field" value={draft.alertMode} onChange={(e) => {
dispatchDraft({ alertMode: e.target.value as AlertMode });
}}>
<option value="note">自動的にノートを投稿</option>
<option value="notification">Misskeyに通知(標準)</option>
<option value="nothing">通知しない</option>
</select>
{draft.alertMode === 'notification' && (
<div className="alert bg-danger mt-2">
<i className="icon bi bi-exclamation-circle"></i>
「Misskey に通知」オプションは古いMisskeyでは動作しません。
<div className="vstack fade">
<div className="card">
<div className="body vstack">
<h1>スコア通知方法</h1>
<div>
<select name="alertMode" className="input-field" value={draft.alertMode} onChange={(e) => {
dispatchDraft({ alertMode: e.target.value as AlertMode });
}}>
<option value="note">自動的にノートを投稿</option>
<option value="notification">Misskeyに通知(標準)</option>
<option value="nothing">通知しない</option>
</select>
{draft.alertMode === 'notification' && (
<div className="alert bg-danger mt-2">
<i className="icon bi bi-exclamation-circle"></i>
「Misskey に通知」オプションは古いMisskeyでは動作しません。
</div>
)}
</div>
)}
</div>
{ draft.alertMode === 'note' && (
<div>
<label htmlFor="visibility" className="input-field">公開範囲</label>
<select name="visibility" className="input-field" value={draft.visibility} onChange={(e) => {
dispatchDraft({ visibility: e.target.value as Visibility });
}}>
<option value="public">パブリック</option>
<option value="home">ホーム</option>
<option value="followers">フォロワー</option>
</select>
<label className="input-switch mt-2">
<input type="checkbox" />
<div className="switch"></div>
<span>ローカル限定</span>
</label>
{ draft.alertMode === 'note' && (
<div>
<label htmlFor="visibility" className="input-field">公開範囲</label>
<select name="visibility" className="input-field" value={draft.visibility} onChange={(e) => {
dispatchDraft({ visibility: e.target.value as Visibility });
}}>
<option value="public">パブリック</option>
<option value="home">ホーム</option>
<option value="followers">フォロワー</option>
</select>
<label className="input-switch mt-2">
<input type="checkbox" />
<div className="switch"></div>
<span>ローカル限定</span>
</label>
</div>
)}
{saveButton}
</div>
</div>
<div className="card">
<div className="body vstack">
<h1>テンプレート</h1>
<textarea className="input-field" value={draft.template ?? defaultTemplate} style={{height: 228}} onChange={(e) => {
dispatchDraft({ template: e.target.value });
}} />
{saveButton}
</div>
)}
<div>
<label htmlFor="template" className="input-field">テンプレート</label>
<textarea className="input-field" value={draft.template ?? defaultTemplate} style={{height: 256}} onChange={(e) => {
dispatchDraft({ template: e.target.value });
}} />
</div>
<button className="btn primary">
設定を保存する
</button>
</div>
);
};