From f4fa6ed08800bb6ee6c668ae97ce0b4c28eca515 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bendeg=C3=BAz=20Hajnal?= <hajnalbendeguz@gmail.com>
Date: Tue, 5 Mar 2024 17:32:31 +0100
Subject: [PATCH] feat(content): qwik update PageTitle.tsx (#224)

* Update PageTitle.tsx

The API changed since this example was added. See https://github.com/BuilderIO/qwik/pull/3215 and https://qwik.dev/docs/components/tasks/#usevisibletask

* Change all occurrences of useClientEffect$
---
 content/2-templating/5-dom-ref/qwik/InputFocused.tsx | 4 ++--
 content/3-lifecycle/1-on-mount/qwik/PageTitle.tsx    | 4 ++--
 content/3-lifecycle/2-on-unmount/qwik/Time.tsx       | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/content/2-templating/5-dom-ref/qwik/InputFocused.tsx b/content/2-templating/5-dom-ref/qwik/InputFocused.tsx
index aeecbfc6..67cd9202 100644
--- a/content/2-templating/5-dom-ref/qwik/InputFocused.tsx
+++ b/content/2-templating/5-dom-ref/qwik/InputFocused.tsx
@@ -1,9 +1,9 @@
-import { component$, useClientEffect$, useRef } from "@builder.io/qwik";
+import { component$, useVisibleTask$, useRef } from "@builder.io/qwik";
 
 export const InputFocused = component$(() => {
   const inputElement = useRef(null);
 
-  useClientEffect$(() => inputElement.current.focus());
+  useVisibleTask$(() => inputElement.current.focus());
 
   return <input type="text" ref={inputElement} />;
 });
diff --git a/content/3-lifecycle/1-on-mount/qwik/PageTitle.tsx b/content/3-lifecycle/1-on-mount/qwik/PageTitle.tsx
index 86fd386d..bdad1f9f 100644
--- a/content/3-lifecycle/1-on-mount/qwik/PageTitle.tsx
+++ b/content/3-lifecycle/1-on-mount/qwik/PageTitle.tsx
@@ -1,11 +1,11 @@
-import { component$, useClientEffect$, useStore } from "@builder.io/qwik";
+import { component$, useVisibleTask$, useStore } from "@builder.io/qwik";
 
 export const App = component$(() => {
   const store = useStore({
     pageTitle: "",
   });
 
-  useClientEffect$(() => {
+  useVisibleTask$(() => {
     store.pageTitle = document.title;
   });
 
diff --git a/content/3-lifecycle/2-on-unmount/qwik/Time.tsx b/content/3-lifecycle/2-on-unmount/qwik/Time.tsx
index 9da5f49b..0e6ec3ea 100644
--- a/content/3-lifecycle/2-on-unmount/qwik/Time.tsx
+++ b/content/3-lifecycle/2-on-unmount/qwik/Time.tsx
@@ -1,11 +1,11 @@
-import { component$, useClientEffect$, useStore } from "@builder.io/qwik";
+import { component$, useVisibleTask$, useStore } from "@builder.io/qwik";
 
 export const App = component$(() => {
   const store = useStore({
     time: new Date().toLocaleTimeString(),
   });
 
-  useClientEffect$(() => {
+  useVisibleTask$(() => {
     const timer = setInterval(() => {
       store.time = new Date().toLocaleTimeString();
     }, 1000);