mirror of
				https://github.com/zadam/trilium.git
				synced 2025-10-31 02:16:05 +01:00 
			
		
		
		
	refactor(react/dialogs): separate alert component
This commit is contained in:
		| @@ -11,6 +11,7 @@ import froca from "../../services/froca.js"; | |||||||
| import FNote from "../../entities/fnote.js"; | import FNote from "../../entities/fnote.js"; | ||||||
| import link from "../../services/link.js"; | import link from "../../services/link.js"; | ||||||
| import Button from "../react/Button.jsx"; | import Button from "../react/Button.jsx"; | ||||||
|  | import Alert from "../react/Alert.jsx"; | ||||||
|  |  | ||||||
| export interface ResolveOptions { | export interface ResolveOptions { | ||||||
|     proceed: boolean; |     proceed: boolean; | ||||||
| @@ -136,10 +137,7 @@ function BrokenRelations({ brokenRelations }: { brokenRelations: DeleteNotesPrev | |||||||
|  |  | ||||||
|     if (brokenRelations.length) { |     if (brokenRelations.length) { | ||||||
|         return ( |         return ( | ||||||
|             <div className="broken-relations-wrapper"> |             <Alert type="danger" title={t("delete_notes.broken_relations_to_be_deleted", { relationCount: brokenRelations.length })}> | ||||||
|                 <div className="alert alert-danger"> |  | ||||||
|                     <h4>{t("delete_notes.broken_relations_to_be_deleted", { relationCount: brokenRelations.length })}</h4> |  | ||||||
|  |  | ||||||
|                 <ul className="broken-relations-list" style={{ maxHeight: "200px", overflow: "auto" }}> |                 <ul className="broken-relations-list" style={{ maxHeight: "200px", overflow: "auto" }}> | ||||||
|                     {brokenRelations.map((_, index) => { |                     {brokenRelations.map((_, index) => { | ||||||
|                         return ( |                         return ( | ||||||
| @@ -149,14 +147,13 @@ function BrokenRelations({ brokenRelations }: { brokenRelations: DeleteNotesPrev | |||||||
|                         ); |                         ); | ||||||
|                     })} |                     })} | ||||||
|                 </ul> |                 </ul> | ||||||
|                 </div> |             </Alert> | ||||||
|             </div> |  | ||||||
|         ); |         ); | ||||||
|     } else { |     } else { | ||||||
|         return ( |         return ( | ||||||
|             <div className="no-note-to-delete-wrapper alert alert-info"> |             <Alert type="info"> | ||||||
|                 {t("delete_notes.no_note_to_delete")} |                 {t("delete_notes.no_note_to_delete")} | ||||||
|             </div> |             </Alert> | ||||||
|         ); |         ); | ||||||
|     } |     } | ||||||
| } | } | ||||||
|   | |||||||
							
								
								
									
										17
									
								
								apps/client/src/widgets/react/Alert.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										17
									
								
								apps/client/src/widgets/react/Alert.tsx
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,17 @@ | |||||||
|  | import { ComponentChildren } from "preact"; | ||||||
|  |  | ||||||
|  | interface AlertProps { | ||||||
|  |     type: "info" | "danger"; | ||||||
|  |     title?: string; | ||||||
|  |     children: ComponentChildren; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | export default function Alert({ title, type, children }: AlertProps) { | ||||||
|  |     return ( | ||||||
|  |         <div className={`alert alert-${type}`}> | ||||||
|  |             {title && <h4>{title}</h4>} | ||||||
|  |  | ||||||
|  |             {children} | ||||||
|  |         </div> | ||||||
|  |     ); | ||||||
|  | } | ||||||
		Reference in New Issue
	
	Block a user