Merge pull request #3 from Exifly:feature/CDS-64-authentication

feat: added snippet authentication

Author: Giovanni D'Andrea

codeishot_extension/.gitignore

@@ -3,4 +3,7 @@ out/
 ./out/*
 
 ./out
-out
+out
+
+## Testing
+.vscode-test

codeishot_extension/package.json

@@ -19,15 +19,23 @@
   "main": "./out/extension.js",
   "contributes": {
     "commands": [
+      {
+        "command": "extension.login",
+        "title": "Login to Codeishot ✨"
+      },
       {
         "command": "extension.postSnippet",
         "title": "Share on Codeishot ✨"
       }
+
     ],
     "menus": {
       "editor/context": [
         {
           "command": "extension.postSnippet"
+        },
+        {
+          "command": "extension.login"
         }
       ]
     },
@@ -38,7 +46,18 @@
         "mac": "ctrl+shift+c",
         "when": "editorTextFocus"
       }
-    ]
+    ],
+    "configuration": {
+      "type": "string",
+      "title": "Codeishot",
+      "properties": {
+          "jwt": {
+              "type": "string",
+              "default": "",
+              "description": "Token to login into codeishot."
+          }
+      }
+  }
   },
   "scripts": {
     "vscode:prepublish": "npm run compile",

codeishot_extension/src/axiosPlugin.ts

@@ -0,0 +1,40 @@
+/**
+ * Ported from vue axios plugin.
+ * Needs to:
+ * - Use the extension configuration instead of authStore
+ * - Change the import.meta
+ */
+
+import axios from "axios";
+import { getTokenFromConfiguration } from "./login";
+
+const fetch = axios.create({
+  baseURL: process.env.API_BASE_URL || "https://api.codeishot.com",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+    Accept: "application/json",
+  },
+  withCredentials: false,
+  responseType: "json",
+});
+
+// Interceptor
+fetch.interceptors.request.use(
+  (config) => {
+    // Check if the user tokens are stored to apply the bearer on the headers,
+    // Otherwise the request is not authenticated.
+    const token = getTokenFromConfiguration();
+
+    if (token) {
+      config.headers.Authorization = `Bearer ${token}`;
+    }
+    return config;
+  },
+  (error) => {
+    console.error(`Error in request ${error}`);
+    return Promise.reject(error);
+  }
+);
+
+export default { fetch };

codeishot_extension/src/config.ts

@@ -0,0 +1,8 @@
+const headers = {
+  accept: "application/json",
+  contentType: "application/json",
+  userAgent: "codeishot/1.0.0",
+  // 'X-CSRFTOKEN': csrfToken,
+};
+
+export { headers };

codeishot_extension/src/customs.ts

@@ -0,0 +1,51 @@
+import type {
+  AxiosResponse,
+  InternalAxiosRequestConfig,
+  AxiosError,
+} from "axios";
+
+export interface CustomResponse {
+  config: InternalAxiosRequestConfig;
+  data: object;
+  status_code: number;
+  status_text: string;
+}
+
+export interface CustomError {
+  code?: string;
+  message: string;
+  data: any; // FIXME: not any
+  status_code?: number;
+  status_text?: string;
+}
+
+/**
+ *
+ * @param {AxiosResponse} r
+ * @returns Custom Axios response object
+ */
+const CustomAxiosResponse = (r: AxiosResponse): CustomResponse => {
+  return {
+    config: r.config,
+    data: r.data,
+    status_code: r.status,
+    status_text: r.statusText,
+  };
+};
+
+/**
+ *
+ * @param {AxiosError} er
+ * @returns Custom Axios error object
+ */
+const CustomAxiosError = (er: AxiosError): CustomError => {
+  return {
+    code: er.code,
+    message: er.message,
+    data: er.response?.data,
+    status_code: er.response?.status,
+    status_text: er.response?.statusText,
+  };
+};
+
+export { CustomAxiosResponse, CustomAxiosError };

codeishot_extension/src/extension.ts

@@ -1,10 +1,9 @@
-import * as vscode from 'vscode';
-import * as path from 'path';
-import axios from 'axios';
+import * as vscode from "vscode";
+import * as path from "path";
+import { login } from "./login";
+import { createSnippet } from "./services/codeishotServices";
 
-const UI_BASE_URL: string = process.env.UI_BASE_URL || 'https://codeishot.com';
-const API_BASE_URL: string = process.env.API_BASE_URL || 'https://api.codeishot.com';
-// const csrfToken = process.env.CSRF_TOKEN;
+const UI_BASE_URL: string = process.env.UI_BASE_URL || "https://codeishot.com";
 
 interface PostData {
   title: string;
@@ -28,7 +27,7 @@ function getSelectedText(editor: vscode.TextEditor): string | null {
   const text = editor.document.getText(selection);
 
   if (!text) {
-    vscode.window.showErrorMessage('No text selected');
+    vscode.window.showErrorMessage("No text selected");
     return null;
   }
 
@@ -54,50 +53,36 @@ function getLanguageIdentifier(): string | null {
   return null;
 }
 
+function checkCreateSnippetStatusCode(status: number, data: PostData) {
+  switch (status) {
+    case 400:
+      vscode.window.showWarningMessage(
+        "This language is not available, sending snippet as a Plain Text"
+      );
+      const newRes = postSnippetWithValidatedData(data);
+      return newRes;
+    case 429:
+      vscode.window.showErrorMessage("Too many requests!");
+      break;
+    default:
+      break;
+  }
+}
+
 async function postSnippet(data: PostData): Promise<Snippet> {
-  return await axios
-    .post(API_BASE_URL + '/api/snippets/', data, {
-      headers: {
-        accept: 'application/json',
-        contentType: 'application/json',
-        userAgent: 'codeishot/1.0.0',
-        // 'X-CSRFTOKEN': csrfToken,
-      },
-    })
-    .then((res) => res.data)
-    .catch((error) => {
-      switch (error.response.status) {
-        case 400:
-          // TODO: Handle if status is 400 AND some other check, not only lanuage
-          vscode.window.showWarningMessage('This language is not available, sending snippet as a Plain Text');
-          const newRes = postSnippetWithValidatedData(data);
-          return newRes;
-        case 429:
-          vscode.window.showErrorMessage('Too many requests!');
-          break;
-        default:
-          vscode.window.showErrorMessage(`CODEISHOT_ERROR: ${error}`);
-          break;
-      }
-      vscode.window.showWarningMessage('Please try again!');
-    });
+  let res = await createSnippet(data);
+  if (res.status_code) checkCreateSnippetStatusCode(res.status_code, data);
+  return res.data as Promise<Snippet>;
 }
 
 async function postSnippetWithValidatedData(data: PostData): Promise<Snippet> {
   let plainTextData: PostData = { ...data };
   plainTextData.language = "plaintext";
 
-  return await axios
-    .post(API_BASE_URL + '/api/snippets/', plainTextData, {
-      headers: {
-        accept: 'application/json',
-        contentType: 'application/json',
-        userAgent: 'codeishot/1.0.0',
-      },
-    })
+  return await createSnippet(plainTextData)
     .then((res) => res.data)
     .catch(() => {
-      vscode.window.showWarningMessage('Please try again!');
+      vscode.window.showWarningMessage("Please try again!");
     });
 }
 
@@ -106,49 +91,63 @@ async function handlePostResponse(data: Snippet) {
     const snippetUrl = `${UI_BASE_URL}/${data.id}`;
     try {
       await vscode.env.clipboard.writeText(snippetUrl);
-      vscode.window.showInformationMessage('URL copied to clipboard');
+      vscode.window.showInformationMessage("URL copied to clipboard");
     } catch (error) {
-      vscode.window.showErrorMessage('Error copying URL: ' + error);
+      vscode.window.showErrorMessage("Error copying URL: " + error);
     }
 
-    const infoMessage = await vscode.window.showInformationMessage(snippetUrl, 'Open URL');
-    if (infoMessage === 'Open URL') {
+    const infoMessage = await vscode.window.showInformationMessage(
+      snippetUrl,
+      "Open URL"
+    );
+    if (infoMessage === "Open URL") {
       vscode.env.openExternal(vscode.Uri.parse(snippetUrl));
     }
   }
 }
 
 function activate(context: vscode.ExtensionContext) {
-  let disposable = vscode.commands.registerCommand('extension.postSnippet', async () => {
-    const editor = vscode.window.activeTextEditor;
-    if (!editor) {
-      vscode.window.showErrorMessage('No editor found');
-      return;
-    }
+  let disposable = vscode.commands.registerCommand(
+    "extension.postSnippet",
+    async () => {
+      const editor = vscode.window.activeTextEditor;
+      if (!editor) {
+        vscode.window.showErrorMessage("No editor found");
+        return;
+      }
 
-    const text = getSelectedText(editor);
-    if (!text) {
-      return;
-    }
+      const text = getSelectedText(editor);
+      if (!text) {
+        return;
+      }
 
-    const postData: PostData = {
-      title: getCurrentFileName() || 'untitled',
-      code: text,
-      language: getLanguageIdentifier() || 'python',
-      style: 'androidstudio',
-    };
+      const postData: PostData = {
+        title: getCurrentFileName() || "untitled",
+        code: text,
+        language: getLanguageIdentifier() || "python",
+        style: "androidstudio",
+      };
+
+      try {
+        const data = await postSnippet(postData);
+        await handlePostResponse(data);
+      } catch (error: any) {
+        vscode.window.showErrorMessage("Error: " + error.message);
+      }
+    }
+  );
 
-    try {
-      const data = await postSnippet(postData);
-      await handlePostResponse(data);
-    } catch (error: any) {
-      vscode.window.showErrorMessage('Error: ' + error.message);
+  const loginCommand = vscode.commands.registerCommand(
+    "extension.login",
+    () => {
+      login();
     }
-  });
+  );
 
   context.subscriptions.push(disposable);
+  context.subscriptions.push(loginCommand);
 }
 
-function deactivate() { }
+function deactivate() {}
 
-export { activate, deactivate };
+export { activate, deactivate };