[8.12] [ML] Update external URLs for E5 models (#172796) (#172975)

# Backport

This will backport the following commits from `main` to `8.12`:
- [[ML] Update external URLs for E5 models
(#172796)](https://github.com/elastic/kibana/pull/172796)

<!--- Backport version: 8.9.7 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Dima
Arnautov","email":"dmitrii.arnautov@elastic.co"},"sourceCommit":{"committedDate":"2023-12-08T16:27:59Z","message":"[ML]
Update external URLs for E5 models (#172796)\n\n## Summary\r\n\r\nAdds
external URLs for each version of the E5 model.\r\n\r\n<img
width=\"1024\"
alt=\"image\"\r\nsrc=\"785eaddd-f081-4be2-b775-1a79cf74e6b8\">\r\n\r\n\r\n###
Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] Any UI
touched in this PR is usable by keyboard only (learn more\r\nabout
[keyboard accessibility](https://webaim.org/techniques/keyboard/))\r\n-
[x] Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))","sha":"4c0299b5783fc523838c19eb0cea85d2daaee83f","branchLabelMapping":{"^v8.13.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":[":ml","cosmetic","release_note:skip","Feature:3rd
Party
Models","Team:ML","v8.12.0","v8.13.0"],"number":172796,"url":"https://github.com/elastic/kibana/pull/172796","mergeCommit":{"message":"[ML]
Update external URLs for E5 models (#172796)\n\n## Summary\r\n\r\nAdds
external URLs for each version of the E5 model.\r\n\r\n<img
width=\"1024\"
alt=\"image\"\r\nsrc=\"785eaddd-f081-4be2-b775-1a79cf74e6b8\">\r\n\r\n\r\n###
Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] Any UI
touched in this PR is usable by keyboard only (learn more\r\nabout
[keyboard accessibility](https://webaim.org/techniques/keyboard/))\r\n-
[x] Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))","sha":"4c0299b5783fc523838c19eb0cea85d2daaee83f"}},"sourceBranch":"main","suggestedTargetBranches":["8.12"],"targetPullRequestStates":[{"branch":"8.12","label":"v8.12.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.13.0","labelRegex":"^v8.13.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/172796","number":172796,"mergeCommit":{"message":"[ML]
Update external URLs for E5 models (#172796)\n\n## Summary\r\n\r\nAdds
external URLs for each version of the E5 model.\r\n\r\n<img
width=\"1024\"
alt=\"image\"\r\nsrc=\"785eaddd-f081-4be2-b775-1a79cf74e6b8\">\r\n\r\n\r\n###
Checklist\r\n\r\n- [x] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated or added to match the most common scenarios\r\n- [x] Any UI
touched in this PR is usable by keyboard only (learn more\r\nabout
[keyboard accessibility](https://webaim.org/techniques/keyboard/))\r\n-
[x] Any UI touched in this PR does not create any new axe
failures\r\n(run axe in
browser:\r\n[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),\r\n[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))\r\n-
[x] This renders correctly on smaller devices using a
responsive\r\nlayout. (You can test this [in
your\r\nbrowser](https://www.browserstack.com/guide/responsive-testing-on-local-server))","sha":"4c0299b5783fc523838c19eb0cea85d2daaee83f"}}]}]
BACKPORT-->

Co-authored-by: Dima Arnautov <dmitrii.arnautov@elastic.co>

x-pack/packages/ml/trained_models_utils/src/constants/trained_models.ts

@@ -105,6 +105,7 @@ export const ELASTIC_MODEL_DEFINITIONS: Record<string, ModelDefinition> = Object
       defaultMessage: 'E5 (EmbEddings from bidirEctional Encoder rEpresentations)',
     }),
     license: 'MIT',
+    licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small',
     type: ['pytorch', 'text_embedding'],
   },
   '.multilingual-e5-small_linux-x86_64': {
@@ -122,6 +123,7 @@ export const ELASTIC_MODEL_DEFINITIONS: Record<string, ModelDefinition> = Object
         'E5 (EmbEddings from bidirEctional Encoder rEpresentations), optimized for linux-x86_64',
     }),
     license: 'MIT',
+    licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small_linux-x86_64',
     type: ['pytorch', 'text_embedding'],
   },
 } as const);
@@ -142,9 +144,13 @@ export interface ModelDefinition {
   os?: string;
   arch?: string;
   default?: boolean;
+  /** Indicates if model version is recommended for deployment based on the cluster configuration */
   recommended?: boolean;
   hidden?: boolean;
+  /** Software license of a model, e.g. MIT */
   license?: string;
+  /** Link to the external license/documentation page */
+  licenseUrl?: string;
   type?: readonly string[];
 }
 

x-pack/plugins/ml/public/application/model_management/add_model_flyout.tsx

@@ -226,18 +226,6 @@ const ClickToDownloadTabContent: FC<ClickToDownloadTabContentProps> = ({
                       />
                     </EuiLink>
                   </EuiFlexItem>
-                  <EuiFlexItem grow={false}>
-                    <EuiBadge
-                      color="hollow"
-                      target={'_blank'}
-                      href={'https://huggingface.co/elastic/multilingual-e5-small-optimized'}
-                    >
-                      <FormattedMessage
-                        id="xpack.ml.trainedModels.modelsList.mitLicenseLabel"
-                        defaultMessage="License: MIT"
-                      />
-                    </EuiBadge>
-                  </EuiFlexItem>
                 </EuiFlexGroup>
                 <EuiSpacer size={'l'} />
               </div>
@@ -286,25 +274,45 @@ const ClickToDownloadTabContent: FC<ClickToDownloadTabContentProps> = ({
                               {model.model_id}
                             </EuiText>
                           </EuiFlexItem>
-                          {model.recommended ? (
-                            <EuiFlexItem grow={false}>
-                              <EuiToolTip
-                                content={
-                                  <FormattedMessage
-                                    id="xpack.ml.trainedModels.modelsList.recommendedDownloadContent"
-                                    defaultMessage="Recommended ELSER model version for your cluster's hardware configuration"
-                                  />
-                                }
-                              >
-                                <EuiBadge color="hollow">
-                                  <FormattedMessage
-                                    id="xpack.ml.trainedModels.addModelFlyout.recommendedDownloadLabel"
-                                    defaultMessage="Recommended"
-                                  />
-                                </EuiBadge>
-                              </EuiToolTip>
-                            </EuiFlexItem>
-                          ) : null}
+                          <EuiFlexItem grow={false}>
+                            <EuiFlexGroup gutterSize={'s'} alignItems={'center'}>
+                              {model.recommended ? (
+                                <EuiFlexItem grow={false}>
+                                  <EuiToolTip
+                                    content={
+                                      <FormattedMessage
+                                        id="xpack.ml.trainedModels.modelsList.recommendedDownloadContent"
+                                        defaultMessage="Recommended model version for your cluster's hardware configuration"
+                                      />
+                                    }
+                                  >
+                                    <EuiBadge color="hollow">
+                                      <FormattedMessage
+                                        id="xpack.ml.trainedModels.addModelFlyout.recommendedDownloadLabel"
+                                        defaultMessage="Recommended"
+                                      />
+                                    </EuiBadge>
+                                  </EuiToolTip>
+                                </EuiFlexItem>
+                              ) : null}
+                              {model.licenseUrl && model.softwareLicense ? (
+                                <EuiFlexItem grow={false}>
+                                  <EuiBadge
+                                    color="hollow"
+                                    target={'_blank'}
+                                    href={model.licenseUrl}
+                                  >
+                                    {model.softwareLicense === 'MIT' ? (
+                                      <FormattedMessage
+                                        id="xpack.ml.trainedModels.modelsList.mitLicenseLabel"
+                                        defaultMessage="License: MIT"
+                                      />
+                                    ) : null}
+                                  </EuiBadge>
+                                </EuiFlexItem>
+                              ) : null}
+                            </EuiFlexGroup>
+                          </EuiFlexItem>
                         </EuiFlexGroup>
                       }
                       name={model.model_id}

x-pack/plugins/ml/public/application/model_management/models_list.tsx

@@ -91,6 +91,8 @@ export type ModelItem = TrainedModelConfigResponse & {
   modelName?: string;
   os?: string;
   arch?: string;
+  softwareLicense?: string;
+  licenseUrl?: string;
 };
 
 export type ModelItemFull = Required<ModelItem>;
@@ -280,6 +282,8 @@ export const ModelsList: FC<Props> = ({
               modelName: modelDefinition.modelName,
               os: modelDefinition.os,
               arch: modelDefinition.arch,
+              softwareLicense: modelDefinition.license,
+              licenseUrl: modelDefinition.licenseUrl,
             } as ModelItem;
           });
         resultItems = [...resultItems, ...notDownloaded];
@@ -534,7 +538,7 @@ export const ModelsList: FC<Props> = ({
             content={
               <FormattedMessage
                 id="xpack.ml.trainedModels.modelsList.recommendedDownloadContent"
-                defaultMessage="Recommended ELSER model version for your cluster's hardware configuration"
+                defaultMessage="Recommended model version for your cluster's hardware configuration"
               />
             }
           >

x-pack/plugins/ml/server/models/model_management/model_provider.test.ts

@@ -87,6 +87,7 @@ describe('modelsProvider', () => {
           version: 1,
           modelName: 'e5',
           license: 'MIT',
+          licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small',
           type: ['pytorch', 'text_embedding'],
         },
         {
@@ -100,6 +101,7 @@ describe('modelsProvider', () => {
           version: 1,
           modelName: 'e5',
           license: 'MIT',
+          licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small_linux-x86_64',
           type: ['pytorch', 'text_embedding'],
         },
       ]);
@@ -167,6 +169,7 @@ describe('modelsProvider', () => {
           modelName: 'e5',
           type: ['pytorch', 'text_embedding'],
           license: 'MIT',
+          licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small',
         },
         {
           arch: 'amd64',
@@ -179,6 +182,7 @@ describe('modelsProvider', () => {
           modelName: 'e5',
           type: ['pytorch', 'text_embedding'],
           license: 'MIT',
+          licenseUrl: 'https://huggingface.co/elastic/multilingual-e5-small_linux-x86_64',
         },
       ]);
     });