@@ -27,25 +27,41 @@ function CommitModal({ onCommitSuccess }) {
2727 const orgId = orgStore . getState ( ) . selectedOrgId ;
2828 const csrfToken = Cookies . get ( "csrftoken" ) ;
2929 const isOpen = useVersionHistoryStore ( ( state ) => state . isCommitModalOpen ) ;
30- const closeCommitModal = useVersionHistoryStore ( ( state ) => state . closeCommitModal ) ;
30+ const closeCommitModal = useVersionHistoryStore (
31+ ( state ) => state . closeCommitModal
32+ ) ;
3133
3234 useEffect ( ( ) => {
3335 if ( ! isOpen ) return ;
3436 let cancelled = false ;
3537 setPreviewLoading ( true ) ;
3638 setPreviewData ( null ) ;
3739 fetchPendingChanges ( axiosRef , orgId , projectId )
38- . then ( ( data ) => { if ( ! cancelled ) setPreviewData ( data ) ; } )
39- . catch ( ( ) => { if ( ! cancelled ) setPreviewData ( null ) ; } )
40- . finally ( ( ) => { if ( ! cancelled ) setPreviewLoading ( false ) ; } ) ;
41- return ( ) => { cancelled = true ; } ;
40+ . then ( ( data ) => {
41+ if ( ! cancelled ) setPreviewData ( data ) ;
42+ } )
43+ . catch ( ( ) => {
44+ if ( ! cancelled ) setPreviewData ( null ) ;
45+ } )
46+ . finally ( ( ) => {
47+ if ( ! cancelled ) setPreviewLoading ( false ) ;
48+ } ) ;
49+ return ( ) => {
50+ cancelled = true ;
51+ } ;
4252 } , [ isOpen ] ) ; // eslint-disable-line
4353
4454 const handleOk = async ( ) => {
4555 if ( ! commitMessage . trim ( ) ) return ;
4656 setLoading ( true ) ;
4757 try {
48- await commitProjectVersion ( axiosRef , orgId , projectId , csrfToken , commitMessage . trim ( ) ) ;
58+ await commitProjectVersion (
59+ axiosRef ,
60+ orgId ,
61+ projectId ,
62+ csrfToken ,
63+ commitMessage . trim ( )
64+ ) ;
4965 notify ( { type : "success" , message : "Version committed successfully" } ) ;
5066 setCommitMessage ( "" ) ;
5167 closeCommitModal ( ) ;
@@ -57,28 +73,83 @@ function CommitModal({ onCommitSuccess }) {
5773 }
5874 } ;
5975
60- const handleCancel = ( ) => { setCommitMessage ( "" ) ; setPreviewData ( null ) ; closeCommitModal ( ) ; } ;
76+ const handleCancel = ( ) => {
77+ setCommitMessage ( "" ) ;
78+ setPreviewData ( null ) ;
79+ closeCommitModal ( ) ;
80+ } ;
6181
62- const collapseItems = previewData ?. changes ?. map ( ( change ) => ( {
63- key : change . model_name ,
64- label : ( < span > { change . model_name } < Tag color = { CHANGE_TYPE_COLORS [ change . change_type ] } > { change . change_type } </ Tag > </ span > ) ,
65- children : (
66- < div className = "commit-preview-diff" >
67- < DiffViewer originalTitle = "Last Committed" modifiedTitle = "Current" originalContent = { change . old_yaml } modifiedContent = { change . new_yaml } forceInline />
68- </ div >
69- ) ,
70- } ) ) || [ ] ;
82+ const collapseItems =
83+ previewData ?. changes ?. map ( ( change ) => ( {
84+ key : change . model_name ,
85+ label : (
86+ < span >
87+ { change . model_name } { " " }
88+ < Tag color = { CHANGE_TYPE_COLORS [ change . change_type ] } >
89+ { change . change_type }
90+ </ Tag >
91+ </ span >
92+ ) ,
93+ children : (
94+ < div className = "commit-preview-diff" >
95+ < DiffViewer
96+ originalTitle = "Last Committed"
97+ modifiedTitle = "Current"
98+ originalContent = { change . old_yaml }
99+ modifiedContent = { change . new_yaml }
100+ forceInline
101+ />
102+ </ div >
103+ ) ,
104+ } ) ) || [ ] ;
71105
72106 return (
73- < Modal title = "Commit Version" open = { isOpen } onOk = { handleOk } onCancel = { handleCancel } okText = "Commit" okButtonProps = { { disabled : ! commitMessage . trim ( ) || loading , loading } } width = { MODAL_WIDTH } centered maskClosable = { false } destroyOnClose >
74- < Typography . Paragraph type = "secondary" style = { { marginBottom : 12 } } > Create a new version snapshot for < strong > all models</ strong > in this project.</ Typography . Paragraph >
75- < Input . TextArea value = { commitMessage } onChange = { ( e ) => setCommitMessage ( e . target . value ) } placeholder = "Describe what changed..." maxLength = { MAX_MESSAGE_LENGTH } showCount rows = { 4 } autoFocus />
107+ < Modal
108+ title = "Commit Version"
109+ open = { isOpen }
110+ onOk = { handleOk }
111+ onCancel = { handleCancel }
112+ okText = "Commit"
113+ okButtonProps = { { disabled : ! commitMessage . trim ( ) || loading , loading } }
114+ width = { MODAL_WIDTH }
115+ centered
116+ maskClosable = { false }
117+ destroyOnClose
118+ >
119+ < Typography . Paragraph type = "secondary" style = { { marginBottom : 12 } } >
120+ Create a new version snapshot for < strong > all models</ strong > in this
121+ project.
122+ </ Typography . Paragraph >
123+ < Input . TextArea
124+ value = { commitMessage }
125+ onChange = { ( e ) => setCommitMessage ( e . target . value ) }
126+ placeholder = "Describe what changed..."
127+ maxLength = { MAX_MESSAGE_LENGTH }
128+ showCount
129+ rows = { 4 }
130+ autoFocus
131+ />
76132 < div className = "commit-preview-section" >
77- { previewLoading && < div className = "commit-preview-empty" > < Spin size = "small" /> </ div > }
78- { ! previewLoading && previewData && ! previewData . has_changes && < div className = "commit-preview-empty" > < Typography . Text type = "secondary" > No changes since last commit</ Typography . Text > </ div > }
133+ { previewLoading && (
134+ < div className = "commit-preview-empty" >
135+ < Spin size = "small" />
136+ </ div >
137+ ) }
138+ { ! previewLoading && previewData && ! previewData . has_changes && (
139+ < div className = "commit-preview-empty" >
140+ < Typography . Text type = "secondary" >
141+ No changes since last commit
142+ </ Typography . Text >
143+ </ div >
144+ ) }
79145 { ! previewLoading && previewData ?. has_changes && (
80146 < >
81- < div className = "commit-preview-summary" > < Typography . Text type = "secondary" > { previewData . total_models_changed } model{ previewData . total_models_changed !== 1 ? "s" : "" } changed</ Typography . Text > </ div >
147+ < div className = "commit-preview-summary" >
148+ < Typography . Text type = "secondary" >
149+ { previewData . total_models_changed } model
150+ { previewData . total_models_changed !== 1 ? "s" : "" } changed
151+ </ Typography . Text >
152+ </ div >
82153 < Collapse items = { collapseItems } size = "small" />
83154 </ >
84155 ) }
0 commit comments