Making serverUrl a reactive dependency for the provided example. (#5392)

The serverUrl variable should be moved inside the component and can be stored as a state to indicate that it's a reactive variable and will be highlighted as such by the linter. Previously the serverUrl variable was stored outside the component function body thus making it a non-reactive value and so it shouldn't have been highlighted by the linter as a useEffect dependency as shown in the concerned example.

beta/src/content/apis/react/useEffect.md

@@ -1023,9 +1023,9 @@ If either `serverUrl` or `roomId` change, your Effect will reconnect to the chat
 **[Reactive values](/learn/lifecycle-of-reactive-effects#effects-react-to-reactive-values) include props and all variables and functions declared directly inside of your component.** Since `roomId` and `serverUrl` are reactive values, you can't remove them from the dependency list. If you try to omit them and [your linter is correctly configured for React,](/learn/editor-setup#linting) the linter will flag this as a mistake that you need to fix:
 
 ```js {8}
-const serverUrl = 'https://localhost:1234';
-
 function ChatRoom({ roomId }) {
+  const [serverUrl, setServerUrl] = useState('https://localhost:1234');
+  
   useEffect(() => {
     const connection = createConnection(serverUrl, roomId);
     connection.connect();