ErrorScreen
エラーを全画面で表示するためのプリミティブコンポーネントです。Auth/Forbidden/NotFound/Unauthorized/Unexpectedの各ErrorScreenで実現できない独自のエラー画面を提供するときに使います。
なんらかのエラーによってユーザーが操作できなくなった場合や、ユーザーに操作をさせたくない場合に使用してください。
使用上の注意
全画面でエラーを表示する必要がないエラーには使用しないでください。
フォームのバリデーションエラーや連携APIの疎通エラーのような一時的なエラーの場合は以下のコンポーネントの使用を検討します。
詳細はフィードバックの基準を参照してください。
レイアウト
ErrorScreenコンポーネントではロゴ、タイトル、メッセージ、リンクを表示できます。
ロゴ
デフォルトでSmartHRのロゴが表示されます。特別な理由がない限り、必ずロゴを表示してください。
タイトル
どのようなエラーが発生したのかがわかる文言を設定します。
メッセージ
タイトルに補足が必要な場合、メッセージを設定します。
リンク
エラーになったときにユーザーの助けになるようなページへ誘導できる場合はリンクを表示してください。
必要に応じて別タブで開くオプションも設定します。
ErrorScreenを使用したコンポーネント
頻繁に利用するErrorScreenのパターンを、エラーの種類に応じたコンポーネントとして用意しています。
AuthErrorScreen
認証フローで問題が発生したことを表示する全画面コンポーネントです。SSOやOAuthなどログイン処理に失敗したときに使います。
ForbiddenErrorScreen
アクセス権限がないことを表示する全画面コンポーネントです。403相当の権限エラーを伝えるときに使います。
NotFoundErrorScreen
存在しないページであることを表示する全画面コンポーネントです。404相当のエラーを伝えるときに使います。
UnauthorizedErrorScreen
セッション切れなど認証が必要な状態を伝える全画面コンポーネントです。401相当のエラーで再ログインが必要なときに使います。
UnexpectedErrorScreen
予期しないエラーが発生したことを表示する全画面コンポーネントです。500相当のサーバーエラーを伝えるときに使います。
props
ロゴ
コンテンツの上に表示されるタイトル
コンテンツの下に表示されるアンカー要素のリスト
表示するコンテンツ
コンポーネントに適用するクラス名