Merge branch 'master' into feature/fix-gql-state

assets/css/fonts.scss

@@ -6,7 +6,9 @@
   font-family: "Material Icons";
   font-style: normal;
   font-weight: 400;
-  font-display: swap;
+  // Do not use font-display: swap for the icon font - it looks really bad when the page
+  // loads.
+  font-display: block;
   src: url("~static/fonts/material-icons-v48.woff2") format("woff2");
 }
 

assets/css/styles.scss

@@ -190,6 +190,7 @@ nav.primary-nav {
     color: var(--fg-light-color);
     fill: var(--fg-light-color);
     margin: 8px 0;
+    height: 52px;
 
     &:hover {
       color: var(--fg-color);

components/ace-editor.vue

@@ -1,7 +1,23 @@
 <template>
-  <pre ref="editor"></pre>
+  <div class="show-if-initialized" :class="{ initialized }">
+    <pre ref="editor"></pre>
+  </div>
 </template>
 
+<style lang="scss">
+  .show-if-initialized {
+    opacity: 0;
+
+    &.initialized {
+      opacity: 1;
+    }
+
+    & > * {
+      transition: none;
+    }
+  }
+</style>
+
 <script>
 const DEFAULT_THEME = "twilight";
 
@@ -30,6 +46,7 @@ export default {
 
   data() {
     return {
+      initialized: false,
       editor: null,
       cacheValue: ""
     };
@@ -43,7 +60,12 @@ export default {
       }
     },
     theme() {
-      this.editor.setTheme("ace/theme/" + this.defineTheme());
+      this.initialized = false;
+      this.editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
+        this.$nextTick().then(() => {
+          this.initialized = true;
+        });
+      });
     },
     lang(value) {
       this.editor.getSession().setMode("ace/mode/" + value);
@@ -55,11 +77,17 @@ export default {
 
   mounted() {
     const editor = ace.edit(this.$refs.editor, {
-      theme: `ace/theme/${this.defineTheme()}`,
       mode: `ace/mode/${this.lang}`,
       ...this.options
     });
 
+    // Set the theme and show the editor only after it's been set to prevent FOUC.
+    editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
+      this.$nextTick().then(() => {
+        this.initialized = true;
+      });
+    });
+
     if (this.value) editor.setValue(this.value, 1);
 
     this.editor = editor;
@@ -83,9 +111,8 @@ export default {
     }
   },
 
-  beforeDestroy() {
+  destroyed() {
     this.editor.destroy();
-    this.editor.container.remove();
   }
 };
 </script>

components/graphql/queryeditor.vue

@@ -1,7 +1,23 @@
 <template>
-  <pre ref="editor"></pre>
+  <div class="show-if-initialized" :class="{ initialized }">
+    <pre ref="editor"></pre>
+  </div>
 </template>
 
+<style lang="scss">
+  .show-if-initialized {
+    opacity: 0;
+
+    &.initialized {
+      opacity: 1;
+    }
+
+    & > * {
+      transition: none;
+    }
+  }
+</style>
+
 <script>
 const DEFAULT_THEME = "twilight";
 
@@ -34,6 +50,7 @@ export default {
 
   data() {
     return {
+      initialized: false,
       editor: null,
       cacheValue: "",
       validationSchema: null
@@ -48,7 +65,12 @@ export default {
       }
     },
     theme() {
-      this.editor.setTheme(`ace/theme/${this.defineTheme()}`);
+      this.initialized = false;
+      this.editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
+        this.$nextTick().then(() => {
+          this.initialized = true;
+        });
+      });
     },
     lang(value) {
       this.editor.getSession().setMode(`ace/mode/${value}`);
@@ -62,13 +84,19 @@ export default {
     let langTools = ace.require("ace/ext/language_tools");
 
     const editor = ace.edit(this.$refs.editor, {
-      theme: `ace/theme/${this.defineTheme()}`,
       mode: `ace/mode/${this.lang}`,
       enableBasicAutocompletion: true,
       enableLiveAutocompletion: true,
       ...this.options
     });
 
+    // Set the theme and show the editor only after it's been set to prevent FOUC.
+    editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
+      this.$nextTick().then(() => {
+        this.initialized = true;
+      });
+    });
+
     const completer = {
       getCompletions: (
         editor,
@@ -167,7 +195,6 @@ export default {
 
   beforeDestroy() {
     this.editor.destroy();
-    this.editor.container.remove();
   }
 };
 </script>

lang/ko-KR.js

@@ -0,0 +1,264 @@
+export default {
+  home: "홈",
+  realtime: "실시간",
+  graphql: "GraphQL",
+  settings: "설정",
+  request: "Request",
+  install_pwa: "PWA 설치",
+  support_us: "도와주기",
+  tweet: "트윗",
+  options: "옵션",
+  communication: "통신",
+  endpoint: "Endpoint",
+  schema: "Schema",
+  theme: "테마",
+  subscribe: "구독",
+  choose_language: "언어 선택",
+  shortcuts: "단축키",
+  send_request: "Send Request",
+  save_to_collections: "Save to Collections",
+  copy_request_link: "Copy Request Link",
+  reset_request: "Reset Request",
+  support_us_on: "Support us on",
+  open_collective: "Open Collective",
+  paypal: "PayPal",
+  patreon: "Patreon",
+  javascript_code: "JavaScript 코드",
+  method: "Method",
+  path: "Path",
+  label: "Label",
+  again: "Again",
+  content_type: "Content Type",
+  raw_input: "Raw input",
+  parameter_list: "Parameter List",
+  raw_request_body: "Raw Request Body",
+  show_code: "Show Code",
+  hide_code: "Hide Code",
+  show_prerequest_script: "Show Pre-Request Script",
+  hide_prerequest_script: "Hide Pre-Request Script",
+  authentication: "Authentication",
+  authentication_type: "Authentication type",
+  include_in_url: "Include in URL",
+  parameters: "Parameters",
+  expand_response: "Expand response",
+  collapse_response: "Collapse response",
+  hide_preview: "Hide Preview",
+  preview_html: "Preview HTML",
+  history: "히스토리",
+  collections: "Collections",
+  import_curl: "Import cURL",
+  import: "가져오기",
+  generate_code: "Generate code",
+  request_type: "Request type",
+  generated_code: "Generated code",
+  status: "상태",
+  headers: "Headers",
+  websocket: "WebSocket",
+  waiting_for_connection: "(waiting for connection)",
+  message: "Message",
+  sse: "SSE",
+  server: "Server",
+  events: "Events",
+  url: "URL",
+  get_schema: "Get schema",
+  header_list: "Header list",
+  add_new: "추가",
+  response: "Response",
+  query: "Query",
+  queries: "Queries",
+  query_variables: "Variables",
+  mutations: "Mutations",
+  subscriptions: "Subscriptions",
+  types: "Types",
+  send: "Send",
+  background: "배경",
+  color: "색상",
+  labels: "Labels",
+  multi_color: "Multi-color",
+  enabled: "허용",
+  disabled: "허용안함",
+  proxy: "Proxy",
+  postwoman_official_proxy_hosting:
+    "Postwoman의 공식적인 Proxy는 ApolloTV가 호스트 합니다.",
+  read_the: "Read the",
+  apollotv_privacy_policy: "ApolloTV 개인정보 처리방침",
+  contact_us: "문의 하기",
+  connect: "연결",
+  disconnect: "연결 중지",
+  start: "시작",
+  stop: "중지",
+  access_token: "Access Token",
+  token_list: "Token List",
+  get_token: "Get New Token",
+  manage_token: "Manage Access Token",
+  save_token: "Save Access Token",
+  use_token: "Use Saved Token",
+  request_token: "Request Token",
+  save_token_req: "Save Token Request",
+  manage_token_req: "Manage Token Request",
+  use_token_req: "Use Token Request",
+  token_req_name: "Request Name",
+  token_req_details: "Request Details",
+  token_name: "Token Name",
+  oidc_discovery_url: "OIDC Discovery URL",
+  auth_url: "Auth URL",
+  access_token_url: "Access Token URL",
+  client_id: "Client ID",
+  scope: "Scope",
+  state: "State",
+  token_req_list: "Token Request List",
+  no_path: "No path",
+  no_label: "No label",
+  prerequest_script: "Pre-Request Script",
+  no_prerequest_script: "No pre-request script",
+  search_history: "히스토리 검색",
+  history_empty: "히스토리가 비었습니다",
+  history_deleted: "History Deleted",
+  clear: "비우기",
+  clear_all: "모두 비우기",
+  cleared: "Cleared",
+  close: "Close",
+  sort: "정렬",
+  time: "Time",
+  duration: "Duration",
+  no_duration: "No duration",
+  show_more: "Show more",
+  hide_more: "Hide more",
+  collection: "Collection",
+  current_collection: "Current Collection",
+  select_collection: "Select a Collection",
+  create_collection: "Create a Collection",
+  new: "New",
+  import_export: "Import / Export",
+  more: "더보기",
+  folder: "Folder",
+  new_folder: "New Folder",
+  my_new_folder: "My New Folder",
+  folder_empty: "Folder is empty",
+  edit_folder: "Edit Folder",
+  edit: "Edit",
+  delete: "Delete",
+  deleted: "Deleted",
+  undo: "되돌리기",
+  collection_empty: "Collection is empty",
+  new_collection: "New Collection",
+  my_new_collection: "My New Collection",
+  edit_collection: "Edit Collection",
+  edit_request: "Edit Request",
+  save_request_as: "Save Request As",
+  export: "내보내기",
+  connecting_to: "Connecting to {name}...",
+  connected: "연결됨",
+  connected_to: "{name} (으)로 연결됨",
+  disconnected: "연결 해제",
+  disconnected_from: "Disconnected from {name}",
+  something_went_wrong: "Something went wrong!",
+  error_occurred: "An error has occurred.",
+  browser_support_sse:
+    "This browser doesn't seems to have Server Sent Events support.",
+  log: "Log",
+  no_url: "No URL",
+  run_query: "Run Query",
+  copy_query: "Copy Query",
+  kinda_dark: "Kinda Dark",
+  clearly_white: "Clearly White",
+  just_black: "Just Black",
+  auto_system: "Auth (system)",
+  green: "Green",
+  yellow: "노랑",
+  pink: "핑크",
+  red: "빨강",
+  purple: "보라",
+  orange: "오렌지",
+  cyan: "청록",
+  blue: "파랑",
+  loading: "로딩...",
+  fetching: "Fetching...",
+  waiting_send_req: "(waiting to send request)",
+  cancel: "취소",
+  save: "저장",
+  dismiss: "무시",
+  are_you_sure: "Are you sure?",
+  yes: "예",
+  no: "아니오",
+  restore: "복구",
+  add_star: "Add star",
+  remove_star: "Remove star",
+  nothing_found: "Nothing found",
+  replace_current: "Replace current",
+  replace_json: "Replace with JSON",
+  preserve_current: "Preserve current",
+  import_json: "Import from JSON",
+  download_file: "파일 다운로드",
+  upload_file: "파일 업로드",
+  copy_response: "Copy response",
+  copy_code: "Copy code",
+  copy_schema: "Copy Schema",
+  use_request: "Use request",
+  documentation: "문서화",
+  docs: "Docs",
+  reset_default: "기본값으로 재설정",
+  fields: "FIELDS",
+  deprecated: "DEPRECATED",
+  add_one_header: "(add at least one header)",
+  add_one_parameter: "(add at least one parameter)",
+  header_count: "header {count}",
+  parameter_count: "parameter {count}",
+  variable_count: "variable {count}",
+  value_count: "value {count}",
+  send_request_first: "Send a request first",
+  generate_docs: "Generate Documentation",
+  generate_docs_message:
+    "Import any Postwoman Collection to Generate Documentation on-the-go.",
+  generate_docs_first: "Generate documentation first",
+  docs_generated: "Documentation generated",
+  import_collections: "Import collections",
+  optional: "(optional)",
+  json: "JSON",
+  none: "None",
+  username: "사용자명",
+  password: "암호",
+  token: "Token",
+  payload: "Payload",
+  choose_file: "파일 선택",
+  file_imported: "File imported",
+  f12_details: "(F12 for details)",
+  we_use_cookies: "우리는 쿠키를 사용합니다",
+  copied_to_clipboard: "Copied to clipboard",
+  finished_in: "Finished in {duration}ms",
+  check_console_details: "Check console for details.",
+  download_started: "Download started",
+  url_invalid_format: "URL is not formatted properly",
+  curl_invalid_format: "cURL is not formatted properly",
+  enable_proxy: "Try enabling Proxy",
+  complete_config_urls: "Please complete configuration urls.",
+  token_request_saved: "Token request saved",
+  donate_info1:
+    "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
+  donate_info2:
+    "You can support Postwoman development via the following methods:",
+  one_time_recurring: "One-time or recurring",
+  one_time: "One-time",
+  recurring: "Recurring",
+  wiki: "위키",
+  error: "오류",
+  go_home: "Go Home",
+  reload: "새로고침",
+  enter_curl: "Enter cURL",
+  empty: "Empty",
+  extensions: "확장 프로그램",
+  extensions_info1: "Postwoman의 액세스를 단순화 하는 브라우저 확장 프로그램",
+  extensions_info2: "Postwoman 확장 프로그램을 설치해보세요!",
+  installed: "설치함",
+  login_with: "Login with",
+  logged_out: "Logged out",
+  logout: "로그아웃",
+  account: "계정",
+  sync: "동기화",
+  syncHistory: "History",
+  syncCollections: "Collections",
+  turn_on: "Turn on",
+  login_first: "Login first",
+  paste_a_collection: "Paste a Collection",
+  import_from_sync: "Import from Sync"
+};

layouts/default.vue

@@ -298,8 +298,8 @@
                 >
                   <i class="material-icons">offline_bolt</i>
                 </button>
-                <login v-if="!fb.currentUser" />
+                <login v-if="fb.currentUser === null" />
-                <span v-if="fb.currentUser">
+                <span v-else>
                   <v-popover>
                     <button
                       class="icon"

nuxt.config.js

@@ -358,6 +358,12 @@ export default {
         name: "日本語",
         iso: "ja-JP",
         file: "ja-JP.js"
+      },
+      {
+        code: "ko",
+        name: "한국어",
+        iso: "ko-KR",
+        file: "ko-KR.js"
       }
     ],
     defaultLocale: "en",

pages/settings.vue

@@ -12,14 +12,14 @@
               />
               <i v-else class="material-icons">account_circle</i>
               <span>
-                {{ fb.currentUser.displayName || "Name not found" }}
+                {{ fb.currentUser.displayName || $t("nothing_found") }}
               </span>
             </button>
             <br />
             <button class="icon">
               <i class="material-icons">email</i>
               <span>
-                {{ fb.currentUser.email || "Email not found" }}
+                {{ fb.currentUser.email || $t("nothing_found") }}
               </span>
             </button>
             <br />
@@ -99,7 +99,7 @@
                 :color="theme.color"
                 :name="theme.name"
                 class="bg"
-              ></swatch>
+              />
             </span>
           </div>
         </li>
@@ -110,7 +110,7 @@
           <div class="colors">
             <span
               :key="entry.color"
-              @click.prevent="setActiveColor(entry.color, entry.vibrant)"
+              @click="setActiveColor(entry.color, entry.vibrant)"
               v-for="entry in colors"
             >
               <swatch
@@ -138,8 +138,8 @@
             </pw-toggle>
           </span>
         </li>
-        </ul>
+      </ul>
-        <ul>
+      <ul>
         <li>
           <span>
             <pw-toggle
@@ -346,12 +346,13 @@ export default {
       ],
 
       settings: {
-        SCROLL_INTO_ENABLED: 
+        SCROLL_INTO_ENABLED:
           typeof this.$store.state.postwoman.settings.SCROLL_INTO_ENABLED !==
           "undefined"
             ? this.$store.state.postwoman.settings.SCROLL_INTO_ENABLED
             : true,
 
+        THEME_CLASS: "",
         THEME_COLOR: "",
         THEME_TAB_COLOR: "",
         THEME_COLOR_VIBRANT: true,
@@ -364,7 +365,7 @@ export default {
           this.$store.state.postwoman.settings.PROXY_URL ||
           "https://postwoman.apollotv.xyz/",
         PROXY_KEY: this.$store.state.postwoman.settings.PROXY_KEY || "",
-        
+
         EXTENSIONS_ENABLED:
           typeof this.$store.state.postwoman.settings.EXTENSIONS_ENABLED !==
           "undefined"

tests/e2e/integration/proxy.spec.js

@@ -13,6 +13,7 @@ describe('Proxy enabled - external request', () => {
   it('Enable the proxy and make a request to the real cat api', () => {
     cy.enableProxy('/?url=https://api.thecatapi.com&path=')
       .get('#send').click()
+      .wait(500)
       .get('#response-details-wrapper').should($wrapper => {
         expect($wrapper).to.contain('Cat API')
       })