Update OV Version (openvinotoolkit#729)

* Update OV Version to Release

* Add GIFs to README.md

* Delete vsix from the repo

* Add Platform Specific Hotkeys and Show Selected Quote Style on the Side Panel

---------

Co-authored-by: Yaroslav Tarkan <yaroslav.tarkan@intel.com>

Author: apaniukov

modules/openvino_code/README.md

@@ -23,9 +23,11 @@ To check the connection manually, use the `Check Connection` button located on t
 
 ### Code Completion
 
+![code_completion](https://github.com/apaniukov/openvino_contrib/assets/51917466/c3ba73bf-106b-4045-a36e-96440f8c804f)
+
 1. Create a new Python file or open an existing one.
 1. Type `def main():` or place the cursor where you'd like code suggestions to be generated.
-1. Press the keyboard shortcut `Ctrl+Alt+Space` or click the `Generate Code Completion` button located in the side panel.
+1. Press the keyboard shortcut `Ctrl+Alt+Space` (`Cmd+Alt+Space` for macOS) or click the `Generate Code Completion` button located in the side panel.
 1. Use the `Tab` key to accept the entire suggestion or `Ctrl`+`Right Arrow` to accept it word by word. To decline the suggestion, press `Esc`.
 
 You can customize the length of the generated code by adjusting `Max New Tokens` and `Min New Tokens` parameters in the extension settings. 
@@ -36,6 +38,8 @@ This mode allows you to immediately receive model output and avoid problems with
 
 ### Summarization via Docstring Generation
 
+![summarization](https://github.com/apaniukov/openvino_contrib/assets/51917466/1d066b0e-cff7-4353-90f9-a53343d60b59)
+
 To generate function docstring start typing `"""` or `'''` right under function signature and choose `Generate Docstring`.
 You can select the desired type of quotes in the extension settings.
 

modules/openvino_code/openvino-code-completion-0.0.4.vsix

@@ -1,7 +1,7 @@
 {
   "publisher": "OpenVINO",
   "name": "openvino-code-completion",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "displayName": "OpenVINO Code Completion",
   "description": "VSCode extension for AI code completion with OpenVINO",
   "icon": "media/logo.png",

modules/openvino_code/package-lock.json

@@ -11,7 +11,7 @@ dependencies = [
     'torch @ https://download.pytorch.org/whl/cpu-cxx11-abi/torch-2.0.1%2Bcpu.cxx11.abi-cp310-cp310-linux_x86_64.whl ; sys_platform=="linux" and python_version == "3.10"',
     'torch @ https://download.pytorch.org/whl/cpu-cxx11-abi/torch-2.0.1%2Bcpu.cxx11.abi-cp311-cp311-linux_x86_64.whl ; sys_platform=="linux" and python_version == "3.11"',
     'torch ; sys_platform != "linux"',
-    'openvino==2023.1.0.dev20230811',
+    'openvino==2023.1.0',
     'transformers==4.31.0',
     'optimum==1.12.0',
     'optimum-intel[openvino]==1.10.1',

modules/openvino_code/package.json

@@ -20,4 +20,5 @@ export interface IExtensionState {
   get isServerAvailable(): boolean;
   get config(): ExtensionConfiguration;
   features: IStateFeatures;
+  platform: NodeJS.Platform;
 }

modules/openvino_code/server/pyproject.toml

@@ -29,8 +29,10 @@ function App(): JSX.Element {
       <ServerSection state={state}></ServerSection>
       {isServerStarted && (
         <>
-          <CompletionSection isLoading={state?.isLoading}></CompletionSection>
-          {isSummarizationSupported && <SummarizationSection></SummarizationSection>}
+          <CompletionSection isLoading={state?.isLoading} platform={state?.platform}></CompletionSection>
+          {isSummarizationSupported && (
+            <SummarizationSection quoteStyle={state?.config.quoteStyle}></SummarizationSection>
+          )}
         </>
       )}
       <ActionsSection></ActionsSection>

modules/openvino_code/shared/extension-state.ts

@@ -5,22 +5,24 @@ import { VscodeIcon } from '../../shared/VscodeIcon/VscodeIcon';
 
 interface CompletionSectionProps {
   isLoading: boolean;
+  platform: NodeJS.Platform;
 }
 
-export function CompletionSection({ isLoading }: CompletionSectionProps = { isLoading: false }): JSX.Element {
+export function CompletionSection({ isLoading, platform }: CompletionSectionProps): JSX.Element {
   const handleGenerateClick = () => {
     vscode.postMessage({
       type: SidePanelMessageTypes.GENERATE_COMPLETION_CLICK,
     });
   };
 
+  const platformKeyBinding = platform === 'darwin' ? 'Cmd+Alt+Space' : 'Ctrl+Alt+Space';
+
   return (
     <section className="completion-section">
       <h3>Code Completion</h3>
       <span>
-        {/* TODO Detect OS and show specific keybindings */}
         {/* TODO Consider getting keybinding from package.json */}
-        To generate inline code completion use combination <kbd>Ctrl+Alt+Space</kbd> or press the button below.
+        To generate inline code completion use combination <kbd>{platformKeyBinding}</kbd> or press the button below.
       </span>
       <br />
       <button className="generate-button" onClick={handleGenerateClick} disabled={isLoading}>

modules/openvino_code/side-panel-ui/src/App.tsx

@@ -1,10 +1,13 @@
-export function SummarizationSection(): JSX.Element {
+interface SummarizationSectionProps {
+  quoteStyle: string;
+}
+
+export function SummarizationSection({ quoteStyle }: SummarizationSectionProps): JSX.Element {
   return (
     <section className="summarization-section">
       <h3>Summarization</h3>
       <span>
-        {/* TODO Consider geting selected docstring quotes from extension settings */}
-        To use summarization for docstrings, start typing docstring quotes (<code>&quot;&quot;&quot;</code> by default).
+        To use summarization for docstrings, start typing docstring quotes (<code>{quoteStyle}</code>).
       </span>
     </section>
   );

modules/openvino_code/side-panel-ui/src/components/sections/CompletionSection/CompletionSection.tsx

@@ -22,8 +22,8 @@ export type CustomConfiguration = {
   endToken: string;
   stopToken: string;
 } & {
-  quoteStyle?: string;
-  docstringFormat?: string;
+  quoteStyle: string;
+  docstringFormat: string;
 };
 
 export type ExtensionConfiguration = WorkspaceConfiguration & CustomConfiguration;

modules/openvino_code/side-panel-ui/src/components/sections/SummarizationSection/SummarizationSection.tsx

@@ -7,6 +7,7 @@ import { IExtensionState, ConnectionStatus } from '@shared/extension-state';
 import { INITIAL_SERVER_STATE, ServerStatus } from '@shared/server-state';
 import { MODEL_SUPPORTED_FEATURES } from '@shared/model';
 import { Features } from '@shared/features';
+import { platform } from 'process';
 
 class ExtensionState implements IExtensionComponent {
   private readonly _state: IExtensionState = {
@@ -28,6 +29,7 @@ class ExtensionState implements IExtensionComponent {
         return this.supportedList.includes(Features.SUMMARIZATION);
       },
     },
+    platform,
   };
 
   private _emitter = new EventEmitter();