chore: Enable strict mode by default, remove fatal log, add missing web check (#6477)

## Summary

This PR is just a set of logger implementation improvements.

- fixes crash on web caused by missing check before the
`executeOnUIRuntimeSync` call (which doesn't exist on web),
- enables `strict` mode by default,
- removes `fatal` log level as it is not used anywhere.

---------

Co-authored-by: Tomasz Żelawski <[email protected]>

Author: MatiPl01

apps/common-app/src/examples/InvalidValueAccessExample.tsx

@@ -9,8 +9,7 @@ import Animated, {
 } from 'react-native-reanimated';
 
 configureReanimatedLogger({
-  // change to `false` or remove the `configureReanimatedLogger` call to
-  // disable the warning
+  // change to `false` to disable the warning
   strict: true,
 });
 

packages/react-native-reanimated/src/ConfigHelper.ts

@@ -4,6 +4,9 @@ import { executeOnUIRuntimeSync, jsiConfigureProps } from './core';
 import { ReanimatedError } from './errors';
 import { updateLoggerConfig } from './logger';
 import type { LoggerConfig } from './logger';
+import { shouldBeUseWeb } from './PlatformChecker';
+
+const SHOULD_BE_USE_WEB = shouldBeUseWeb();
 
 function assertNoOverlapInLists() {
   for (const key in PropsAllowlists.NATIVE_THREAD_PROPS_WHITELIST) {
@@ -54,11 +57,22 @@ export function addWhitelistedUIProps(props: Record<string, boolean>): void {
   }
 }
 
+/**
+ * Updates Reanimated logger config with the user-provided configuration. Will
+ * affect Reanimated code executed after call to this function so it should be
+ * called before any Reanimated code is executed to take effect. Each call to
+ * this function will override the previous configuration (it's recommended to
+ * call it only once).
+ *
+ * @param config - The new logger configuration to apply.
+ */
 export function configureReanimatedLogger(config: LoggerConfig) {
   // Update the configuration object in the React runtime
   updateLoggerConfig(config);
   // Register the updated configuration in the UI runtime
-  executeOnUIRuntimeSync(updateLoggerConfig)(config);
+  if (!SHOULD_BE_USE_WEB) {
+    executeOnUIRuntimeSync(updateLoggerConfig)(config);
+  }
 }
 
 const PROCESSED_VIEW_NAMES = new Set();

packages/react-native-reanimated/src/logger/logger.ts

@@ -7,7 +7,6 @@ type LogFunction = (data: LogData) => void;
 export enum LogLevel {
   warn = 1,
   error = 2,
-  fatal = 3,
 }
 
 export type LoggerConfig = {
@@ -36,7 +35,7 @@ function logToConsole(data: LogData) {
 export const DEFAULT_LOGGER_CONFIG: LoggerConfigInternal = {
   logFunction: logToConsole,
   level: LogLevel.warn,
-  strict: false,
+  strict: true,
 };
 
 function formatMessage(message: string) {
@@ -117,7 +116,7 @@ type LogOptions = {
 };
 
 function handleLog(
-  level: Exclude<LogBoxLogLevel, 'syntax'>,
+  level: Exclude<LogBoxLogLevel, 'syntax' | 'fatal'>,
   message: string,
   options: LogOptions
 ) {
@@ -144,8 +143,4 @@ export const logger = {
     'worklet';
     handleLog('error', message, options);
   },
-  fatal(message: string, options: LogOptions = {}) {
-    'worklet';
-    handleLog('fatal', message, options);
-  },
 };

packages/react-native-reanimated/src/mutables.ts

@@ -18,7 +18,7 @@ function shouldWarnAboutAccessDuringRender() {
 function checkInvalidReadDuringRender() {
   if (shouldWarnAboutAccessDuringRender()) {
     logger.warn(
-      'Reading from `value` during component render. Please ensure that you do not access the `value` property while React is rendering a component.',
+      'Reading from `value` during component render. Please ensure that you do not access the `value` property or use `get` method of a shared value while React is rendering a component.',
       { strict: true }
     );
   }
@@ -27,7 +27,7 @@ function checkInvalidReadDuringRender() {
 function checkInvalidWriteDuringRender() {
   if (shouldWarnAboutAccessDuringRender()) {
     logger.warn(
-      'Writing to `value` during component render. Please ensure that you do not access the `value` property while React is rendering a component.',
+      'Writing to `value` during component render. Please ensure that you do not access the `value` property or use `set` method of a shared value while React is rendering a component.',
       { strict: true }
     );
   }