Merge pull request #7973 from QwikDev/fix-css-properties

fix(repl): console logging

Author: wmertens

packages/docs/src/repl/bundler/client-events-listener.ts

@@ -2,7 +2,7 @@ import type { QwikSymbolEvent } from '@builder.io/qwik';
 import type { ReplEvent } from '../types';
 
 (() => {
-  const replId = location.pathname.split('/')[2];
+  const replId = location.pathname.split('/')[3];
   const origConsole: Record<string, any> = {};
 
   const sendToServerWindow = (data: Omit<ReplEvent, 'start'>) => {

packages/docs/src/routes/examples/apps/reactivity/auto-complete/app.tsx

@@ -5,11 +5,11 @@ export default component$(() => {
     <article>
       This example features an auto-complete component with a debounce of 150 ms.
       <br />
-      The function `debouncedGetPeople` needs to be exported because it is used in `useTask$`.
-      <br />
       <br />
       Go ahead, search for Star Wars characters such as "Luke Skywalker", it uses the{' '}
-      <a href="https://swapi.dev/">Star Wars API</a>
+      <a href="https://swapi-node.vercel.app/">Star Wars API</a>:
+      <br />
+      <br />
       <AutoComplete></AutoComplete>
     </article>
   );
@@ -60,22 +60,23 @@ export const SuggestionsListComponent = (props: { state: IState }) => {
         return <li onClick$={() => (props.state.selectedValue = suggestion)}>{suggestion}</li>;
       })}
     </ul>
-  ) : (
+  ) : props.state.searchInput ? (
     <p class="no-results">
-      <em>No suggestions, you re on your own!</em>
+      <em>No results</em>
     </p>
-  );
+  ) : null;
 };
 
 const getPeople = (searchInput: string, controller?: AbortController): Promise<string[]> =>
-  fetch(`https://swapi.dev/api/people/?search=${searchInput}`, {
+  fetch(`https://swapi-node.vercel.app/api/people/?search=${searchInput}`, {
     signal: controller?.signal,
   })
     .then((response) => {
       return response.json();
     })
     .then((parsedResponse) => {
-      return parsedResponse.results.map((people: { name: string }) => people.name);
+      debugger;
+      return parsedResponse.results.map((people: any) => people.fields.name);
     });
 
 function debounce<F extends (...args: any) => any>(fn: F, delay = 500) {
@@ -91,4 +92,4 @@ function debounce<F extends (...args: any) => any>(fn: F, delay = 500) {
   };
 }
 
-export const debouncedGetPeople = debounce(getPeople, 150);
+const debouncedGetPeople = debounce(getPeople, 150);