Skip to content

Combine snippet embed and clone buttons into single code dropdown

Annabel Dunstone Gray requested to merge combine-code-embed into master

What does this MR do and why?

  • Combines Embed into Clone dropdown
  • Renames dropdown Code

Next: In a separate MR we'll move it up next the edit/ellipsis buttons

Screenshots or screen recordings

Embeddable snippet

Before After
Screenshot_2024-03-25_at_10.24.17_AM Screenshot_2024-03-25_at_10.24.04_AM

Non-embeddable snippet

Before After
Screenshot_2024-03-25_at_10.24.25_AM Screenshot_2024-03-25_at_10.23.43_AM

How to set up and validate locally

  1. Go to embeddable snippet
example.json 
{"openapi":"3.1.0","info":{"title":"GitLab Code Suggestions","description":"GitLab Code Suggestions API to serve code completion predictions","version":"0.1.0"},"paths":{"/v1/chat/agent":{"post":{"tags":["chat"],"summary":"Chat","operationId":"chat_v1_chat_agent_post","requestBody":{"content":{"application/json":{"schema":{"$ref":"#/components/schemas/ChatRequest"}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ChatResponse"}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/v1/x-ray/libraries":{"post":{"tags":["x-ray"],"summary":"Libraries","operationId":"libraries_v1_x_ray_libraries_post","requestBody":{"content":{"application/json":{"schema":{"$ref":"#/components/schemas/XRayRequest"}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{"$ref":"#/components/schemas/XRayResponse"}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/v2/code/completions":{"post":{"tags":["completions"],"summary":"Completions","operationId":"completions_v2_code_completions_post","requestBody":{"content":{"application/json":{"schema":{"oneOf":[{"$ref":"#/components/schemas/CompletionsRequestV1"},{"$ref":"#/components/schemas/CompletionsRequestV2"}],"title":"Payload","discriminator":{"propertyName":"prompt_version","mapping":{"1":"#/components/schemas/CompletionsRequestV1","2":"#/components/schemas/CompletionsRequestV2"}}}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/v2/completions":{"post":{"tags":["completions"],"summary":"Completions","operationId":"completions_v2_completions_post","requestBody":{"content":{"application/json":{"schema":{"oneOf":[{"$ref":"#/components/schemas/CompletionsRequestV1"},{"$ref":"#/components/schemas/CompletionsRequestV2"}],"title":"Payload","discriminator":{"propertyName":"prompt_version","mapping":{"1":"#/components/schemas/CompletionsRequestV1","2":"#/components/schemas/CompletionsRequestV2"}}}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/v2/code/generations":{"post":{"tags":["completions"],"summary":"Generations","operationId":"generations_v2_code_generations_post","requestBody":{"content":{"application/json":{"schema":{"oneOf":[{"$ref":"#/components/schemas/GenerationsRequestV1"},{"$ref":"#/components/schemas/GenerationsRequestV2"}],"title":"Payload","discriminator":{"propertyName":"prompt_version","mapping":{"1":"#/components/schemas/GenerationsRequestV1","2":"#/components/schemas/GenerationsRequestV2"}}}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/v3/code/completions":{"post":{"tags":["completions"],"summary":"Completions","operationId":"completions_v3_code_completions_post","requestBody":{"content":{"application/json":{"schema":{"$ref":"#/components/schemas/CompletionRequest"}}},"required":true},"responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{}}}},"422":{"description":"Validation Error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/HTTPValidationError"}}}}}}},"/monitoring/healthz":{"get":{"tags":["monitoring"],"summary":"Endpoint","operationId":"endpoint_monitoring_healthz_get","responses":{"200":{"description":"Successful Response","content":{"application/json":{"schema":{}}}}}}}},"components":{"schemas":{"AnthropicParams":{"properties":{"stop_sequences":{"items":{"type":"string","maxLength":225},"type":"array","maxItems":10,"minItems":1,"title":"Stop Sequences","default":["\n\nHuman","Observation:"]},"temperature":{"type":"number","maximum":1.0,"minimum":0.0,"title":"Temperature","default":0.2},"max_tokens_to_sample":{"type":"integer","maximum":2048.0,"minimum":1.0,"title":"Max Tokens To Sample","default":2048}},"type":"object","title":"AnthropicParams"},"ChatRequest":{"properties":{"prompt_components":{"items":{"$ref":"#/components/schemas/PromptComponent"},"type":"array","maxItems":1,"minItems":1,"title":"Prompt Components"},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false}},"type":"object","required":["prompt_components"],"title":"ChatRequest"},"ChatResponse":{"properties":{"response":{"type":"string","title":"Response"},"metadata":{"$ref":"#/components/schemas/ChatResponseMetadata"}},"type":"object","required":["response","metadata"],"title":"ChatResponse"},"ChatResponseMetadata":{"properties":{"provider":{"type":"string","title":"Provider"},"model":{"type":"string","title":"Model"},"timestamp":{"type":"integer","title":"Timestamp"}},"type":"object","required":["provider","model","timestamp"],"title":"ChatResponseMetadata"},"CodeEditorCompletion":{"properties":{"type":{"const":"code_editor_completion","title":"Type"},"payload":{"$ref":"#/components/schemas/EditorContentCompletionPayload"},"metadata":{"anyOf":[{"$ref":"#/components/schemas/MetadataBase"},{"type":"null"}]}},"type":"object","required":["type","payload"],"title":"CodeEditorCompletion"},"CodeEditorGeneration":{"properties":{"type":{"const":"code_editor_generation","title":"Type"},"payload":{"$ref":"#/components/schemas/EditorContentGenerationPayload"},"metadata":{"anyOf":[{"$ref":"#/components/schemas/MetadataBase"},{"type":"null"}]}},"type":"object","required":["type","payload"],"title":"CodeEditorGeneration"},"CompletionRequest":{"properties":{"prompt_components":{"items":{"oneOf":[{"$ref":"#/components/schemas/CodeEditorCompletion"},{"$ref":"#/components/schemas/CodeEditorGeneration"}],"discriminator":{"propertyName":"type","mapping":{"code_editor_completion":"#/components/schemas/CodeEditorCompletion","code_editor_generation":"#/components/schemas/CodeEditorGeneration"}}},"type":"array","maxItems":1,"minItems":1,"title":"Prompt Components"}},"type":"object","required":["prompt_components"],"title":"CompletionRequest"},"CompletionsRequestV1":{"properties":{"project_path":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Project Path"},"project_id":{"anyOf":[{"type":"integer"},{"type":"null"}],"title":"Project Id"},"current_file":{"$ref":"#/components/schemas/CurrentFile"},"model_provider":{"anyOf":[{"$ref":"#/components/schemas/KindModelProvider"},{"type":"null"}]},"model_name":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Name"},"telemetry":{"items":{"$ref":"#/components/schemas/Telemetry"},"type":"array","maxItems":10,"title":"Telemetry","default":[]},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false},"prompt_version":{"const":1,"title":"Prompt Version","default":1}},"type":"object","required":["current_file"],"title":"CompletionsRequestV1"},"CompletionsRequestV2":{"properties":{"project_path":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Project Path"},"project_id":{"anyOf":[{"type":"integer"},{"type":"null"}],"title":"Project Id"},"current_file":{"$ref":"#/components/schemas/CurrentFile"},"model_provider":{"anyOf":[{"$ref":"#/components/schemas/KindModelProvider"},{"type":"null"}]},"model_name":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Name"},"telemetry":{"items":{"$ref":"#/components/schemas/Telemetry"},"type":"array","maxItems":10,"title":"Telemetry","default":[]},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false},"prompt_version":{"const":2,"title":"Prompt Version"},"prompt":{"type":"string","title":"Prompt"}},"type":"object","required":["current_file","prompt_version","prompt"],"title":"CompletionsRequestV2"},"CurrentFile":{"properties":{"file_name":{"type":"string","maxLength":255,"title":"File Name"},"language_identifier":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Language Identifier"},"content_above_cursor":{"type":"string","maxLength":100000,"title":"Content Above Cursor"},"content_below_cursor":{"type":"string","maxLength":100000,"title":"Content Below Cursor"}},"type":"object","required":["file_name","content_above_cursor","content_below_cursor"],"title":"CurrentFile"},"EditorContentCompletionPayload":{"properties":{"file_name":{"type":"string","maxLength":255,"title":"File Name"},"content_above_cursor":{"type":"string","maxLength":100000,"title":"Content Above Cursor"},"content_below_cursor":{"type":"string","maxLength":100000,"title":"Content Below Cursor"},"language_identifier":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Language Identifier"},"model_provider":{"anyOf":[{"type":"string","enum":["vertex-ai","anthropic"]},{"type":"null"}],"title":"Model Provider"},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false}},"type":"object","required":["file_name","content_above_cursor","content_below_cursor"],"title":"EditorContentCompletionPayload"},"EditorContentGenerationPayload":{"properties":{"file_name":{"type":"string","maxLength":255,"title":"File Name"},"content_above_cursor":{"type":"string","maxLength":100000,"title":"Content Above Cursor"},"content_below_cursor":{"type":"string","maxLength":100000,"title":"Content Below Cursor"},"language_identifier":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Language Identifier"},"model_provider":{"anyOf":[{"type":"string","enum":["vertex-ai","anthropic"]},{"type":"null"}],"title":"Model Provider"},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false},"prompt":{"anyOf":[{"type":"string","maxLength":400000},{"type":"null"}],"title":"Prompt"}},"type":"object","required":["file_name","content_above_cursor","content_below_cursor"],"title":"EditorContentGenerationPayload"},"ExperimentTelemetry":{"properties":{"name":{"type":"string","title":"Name"},"variant":{"type":"integer","title":"Variant"}},"type":"object","required":["name","variant"],"title":"ExperimentTelemetry"},"GenerationsRequestV1":{"properties":{"project_path":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Project Path"},"project_id":{"anyOf":[{"type":"integer"},{"type":"null"}],"title":"Project Id"},"current_file":{"$ref":"#/components/schemas/CurrentFile"},"model_provider":{"anyOf":[{"$ref":"#/components/schemas/KindModelProvider"},{"type":"null"}]},"model_name":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Name"},"telemetry":{"items":{"$ref":"#/components/schemas/Telemetry"},"type":"array","maxItems":10,"title":"Telemetry","default":[]},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false},"prompt_version":{"const":1,"title":"Prompt Version","default":1}},"type":"object","required":["current_file"],"title":"GenerationsRequestV1"},"GenerationsRequestV2":{"properties":{"project_path":{"anyOf":[{"type":"string","maxLength":255},{"type":"null"}],"title":"Project Path"},"project_id":{"anyOf":[{"type":"integer"},{"type":"null"}],"title":"Project Id"},"current_file":{"$ref":"#/components/schemas/CurrentFile"},"model_provider":{"anyOf":[{"$ref":"#/components/schemas/KindModelProvider"},{"type":"null"}]},"model_name":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Name"},"telemetry":{"items":{"$ref":"#/components/schemas/Telemetry"},"type":"array","maxItems":10,"title":"Telemetry","default":[]},"stream":{"anyOf":[{"type":"boolean"},{"type":"null"}],"title":"Stream","default":false},"prompt_version":{"const":2,"title":"Prompt Version"},"prompt":{"type":"string","title":"Prompt"}},"type":"object","required":["current_file","prompt_version","prompt"],"title":"GenerationsRequestV2"},"HTTPValidationError":{"properties":{"detail":{"items":{"$ref":"#/components/schemas/ValidationError"},"type":"array","title":"Detail"}},"type":"object","title":"HTTPValidationError"},"KindAnthropicModel":{"type":"string","enum":["claude-instant-1.1","claude-instant-1.2","claude-2.0","claude-2.1","claude-3-opus-20240229","claude-3-sonnet-20240229"],"title":"KindAnthropicModel"},"KindModelProvider":{"type":"string","enum":["anthropic","vertex-ai"],"title":"KindModelProvider"},"MetadataBase":{"properties":{"source":{"type":"string","maxLength":255,"title":"Source"},"version":{"type":"string","maxLength":255,"title":"Version"}},"type":"object","required":["source","version"],"title":"MetadataBase"},"PackageFilePromptComponent":{"properties":{"type":{"const":"x_ray_package_file_prompt","title":"Type","default":"x_ray_package_file_prompt"},"payload":{"$ref":"#/components/schemas/PackageFilePromptPayload"},"metadata":{"anyOf":[{"additionalProperties":{"type":"string","maxLength":255},"type":"object"},{"type":"null"}],"title":"Metadata"}},"type":"object","required":["payload"],"title":"PackageFilePromptComponent"},"PackageFilePromptPayload":{"properties":{"prompt":{"type":"string","maxLength":400000,"title":"Prompt"},"provider":{"const":"anthropic","title":"Provider"},"model":{"type":"string","enum":["claude-instant-1.2","claude-2.0"],"title":"Model"}},"type":"object","required":["prompt","provider","model"],"title":"PackageFilePromptPayload"},"PromptComponent":{"properties":{"type":{"title":"Type"},"metadata":{"$ref":"#/components/schemas/PromptMetadata"},"payload":{"$ref":"#/components/schemas/PromptPayload"}},"type":"object","required":["type","metadata","payload"],"title":"PromptComponent"},"PromptMetadata":{"properties":{"source":{"type":"string","maxLength":100,"title":"Source"},"version":{"type":"string","maxLength":100,"title":"Version"}},"type":"object","required":["source","version"],"title":"PromptMetadata"},"PromptPayload":{"properties":{"content":{"maxLength":400000,"title":"Content"},"provider":{"anyOf":[{"const":"anthropic"},{"type":"null"}],"title":"Provider"},"model":{"anyOf":[{"$ref":"#/components/schemas/KindAnthropicModel"},{"type":"null"}],"default":"claude-2.0"},"params":{"anyOf":[{"$ref":"#/components/schemas/AnthropicParams"},{"type":"null"}]}},"type":"object","required":["content"],"title":"PromptPayload"},"Telemetry":{"properties":{"model_engine":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Engine"},"model_name":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Model Name"},"lang":{"anyOf":[{"type":"string","maxLength":50},{"type":"null"}],"title":"Lang"},"experiments":{"anyOf":[{"items":{"$ref":"#/components/schemas/ExperimentTelemetry"},"type":"array"},{"type":"null"}],"title":"Experiments"},"requests":{"type":"integer","title":"Requests"},"accepts":{"type":"integer","title":"Accepts"},"errors":{"type":"integer","title":"Errors"}},"type":"object","required":["requests","accepts","errors"],"title":"Telemetry"},"ValidationError":{"properties":{"loc":{"items":{"anyOf":[{"type":"string"},{"type":"integer"}]},"type":"array","title":"Location"},"msg":{"type":"string","title":"Message"},"type":{"type":"string","title":"Error Type"}},"type":"object","required":["loc","msg","type"],"title":"ValidationError"},"XRayRequest":{"properties":{"prompt_components":{"items":{"$ref":"#/components/schemas/PackageFilePromptComponent"},"type":"array","maxItems":1,"minItems":1,"title":"Prompt Components"}},"type":"object","required":["prompt_components"],"title":"XRayRequest"},"XRayResponse":{"properties":{"response":{"type":"string","title":"Response"}},"type":"object","required":["response"],"title":"XRayResponse"}}}}
  • Go to non-embeddable snippet

Links

Edited by Annabel Dunstone Gray

Merge request reports