Test

Author: Keivan Vosoughi

app/client/src/pages/Settings/EditModelProvider.tsx

@@ -60,6 +60,7 @@ const GEMINI_MODELS_OPTIONS = GEMINI_MODELS.map((model: string) => ({
 
 interface Props {
     refetch: () => void;
+    onClose: () => void;
     model: CustomModel;
 }
 
@@ -92,14 +93,13 @@ const EditModelProvider: React.FC<Props> = ({ model, refetch }) => {
                 message: 'Success',
                 description: `THe model provider has been edited successfully!.`
               });
-          setShowModal(false);
           refetch();
         }
     }, [mutation.error, mutation.isSuccess]);
 
     const onCancel = () => {
         form.resetFields();
-        setShowModal(false);
+        onClose()
     }
 
     const onSubmit = async () => {
@@ -140,7 +140,7 @@ const EditModelProvider: React.FC<Props> = ({ model, refetch }) => {
 
     return (
         <>
-            {showModal && <Modal
+            <Modal
                 visible
                 okText={`Edit`}
                 title={`Edit Model Provider`}
@@ -228,7 +228,7 @@ const EditModelProvider: React.FC<Props> = ({ model, refetch }) => {
                        <Input.Password />
                     </Form.Item>
                 </Form>
-            </Modal>}    
+            </Modal>    
         </>
     );
 }

app/client/src/pages/Settings/SettingsPage.tsx

@@ -90,13 +90,12 @@ const SettingsPage: React.FC = () => {
     const onDelete = (model: CustomModel) => {
         Modal.confirm({
           content: (
-            <span>{`Are you sure you want to delete the model ${model}`}</span>
+            <span>{`Are you sure you want to delete the model ${model.display_name}`}</span>
           ),
           onOk: async () => {
             try {
                 mutation.mutate({
-                    model_id: model.model_id,
-                    provider_type: model.provider_type
+                    endpoint_id: model.endpoint_id
                 })
             } catch (error) {
               notification.error({
@@ -224,7 +223,8 @@ const SettingsPage: React.FC = () => {
                     </Col>
                 </Row>
                 </Container>
-                {showModal && <EditModelProvider model={model as CustomModel} refetch={filteredModelsReq.refetch} />}
+                {showModal && 
+                    <EditModelProvider model={model as CustomModel} refetch={filteredModelsReq.refetch} onClose={() => setShowModal(false)} />}
             </StyledContent>
         </Layout>        
     );