From 61d3862e5621530e2ce0146236161f1fad54e231 Mon Sep 17 00:00:00 2001
From: Damien Montastier <montastier.damien@gmail.com>
Date: Fri, 3 Jan 2025 19:47:39 +0100
Subject: [PATCH] fix V2 update and modify code about reviews

---
 docs/.vitepress/config.ts                     |  2 +-
 .../components/pmdrs/ToneMappingDemo.vue      |  8 ++++----
 .../{tonemapping.md => tone-mapping.md}       |  0
 .../{tonemapping.vue => tone-mapping.vue}     |  8 ++++----
 playground/src/router.ts                      |  2 +-
 ...{ToneMapping.vue => ToneMappingPmndrs.vue} | 19 +++++++------------
 src/core/pmndrs/index.ts                      |  3 +++
 7 files changed, 20 insertions(+), 22 deletions(-)
 rename docs/guide/pmndrs/{tonemapping.md => tone-mapping.md} (100%)
 rename playground/src/pages/postprocessing/{tonemapping.vue => tone-mapping.vue} (85%)
 rename src/core/pmndrs/{ToneMapping.vue => ToneMappingPmndrs.vue} (74%)

diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts
index 92f9b4cc..e62a60b3 100644
--- a/docs/.vitepress/config.ts
+++ b/docs/.vitepress/config.ts
@@ -53,7 +53,7 @@ export default defineConfig({
           { text: 'Glitch', link: '/guide/pmndrs/glitch' },
           { text: 'Noise', link: '/guide/pmndrs/noise' },
           { text: 'Outline', link: '/guide/pmndrs/outline' },
-          { text: 'ToneMapping', link: '/guide/pmndrs/tonemapping' },
+          { text: 'Tone Mapping', link: '/guide/pmndrs/tone-mapping' },
           { text: 'Pixelation', link: '/guide/pmndrs/pixelation' },
           { text: 'Vignette', link: '/guide/pmndrs/vignette' },
         ],
diff --git a/docs/.vitepress/theme/components/pmdrs/ToneMappingDemo.vue b/docs/.vitepress/theme/components/pmdrs/ToneMappingDemo.vue
index 6a2ee923..d53d095f 100644
--- a/docs/.vitepress/theme/components/pmdrs/ToneMappingDemo.vue
+++ b/docs/.vitepress/theme/components/pmdrs/ToneMappingDemo.vue
@@ -2,7 +2,7 @@
 import { ContactShadows, Environment, Levioso, OrbitControls, useGLTF } from '@tresjs/cientos'
 import { dispose, TresCanvas } from '@tresjs/core'
 import { TresLeches, useControls } from '@tresjs/leches'
-import { EffectComposer, ToneMapping } from '@tresjs/post-processing/pmndrs'
+import { EffectComposerPmndrs, ToneMappingPmndrs } from '@tresjs/post-processing'
 import { ToneMappingMode } from 'postprocessing'
 import { NoToneMapping } from 'three'
 import { onUnmounted, shallowRef } from 'vue'
@@ -67,9 +67,9 @@ onUnmounted(() => {
     />
 
     <Suspense>
-      <EffectComposer>
-        <ToneMapping :mode="Number(mode.value)" />
-      </EffectComposer>
+      <EffectComposerPmndrs>
+        <ToneMappingPmndrs :mode="Number(mode.value)" />
+      </EffectComposerPmndrs>
     </Suspense>
   </TresCanvas>
 </template>
diff --git a/docs/guide/pmndrs/tonemapping.md b/docs/guide/pmndrs/tone-mapping.md
similarity index 100%
rename from docs/guide/pmndrs/tonemapping.md
rename to docs/guide/pmndrs/tone-mapping.md
diff --git a/playground/src/pages/postprocessing/tonemapping.vue b/playground/src/pages/postprocessing/tone-mapping.vue
similarity index 85%
rename from playground/src/pages/postprocessing/tonemapping.vue
rename to playground/src/pages/postprocessing/tone-mapping.vue
index 11ed36c2..4481f33a 100644
--- a/playground/src/pages/postprocessing/tonemapping.vue
+++ b/playground/src/pages/postprocessing/tone-mapping.vue
@@ -2,9 +2,9 @@
 import { ContactShadows, Environment, OrbitControls } from '@tresjs/cientos'
 import { TresCanvas } from '@tresjs/core'
 import { TresLeches, useControls } from '@tresjs/leches'
-import { EffectComposer, ToneMapping } from '@tresjs/post-processing/pmndrs'
 import { BlendFunction, ToneMappingMode } from 'postprocessing'
 import { NoToneMapping } from 'three'
+import { EffectComposerPmndrs, ToneMappingPmndrs } from '@tresjs/post-processing'
 
 import '@tresjs/leches/styles'
 
@@ -69,9 +69,9 @@ const { blendFunction, resolution, mode } = useControls({
     />
 
     <Suspense>
-      <EffectComposer>
-        <ToneMapping :mode="Number(mode.value)" :resolution="Number(resolution.value)" :blendFunction="Number(blendFunction.value)" />
-      </EffectComposer>
+      <EffectComposerPmndrs>
+        <ToneMappingPmndrs :mode="Number(mode.value)" :resolution="Number(resolution.value)" :blendFunction="Number(blendFunction.value)" />
+      </EffectComposerPmndrs>
     </Suspense>
   </TresCanvas>
 </template>
diff --git a/playground/src/router.ts b/playground/src/router.ts
index 9576c1ca..80b8ab21 100644
--- a/playground/src/router.ts
+++ b/playground/src/router.ts
@@ -33,7 +33,7 @@ export const threeRoutes = [
 
 export const postProcessingRoutes = [
   makeRoute('Outline', '🔲', false),
-  makeRoute('Tonemapping', '🎨', false),
+  makeRoute('Tone Mapping', '🎨', false),
   makeRoute('Glitch', '📺', false),
   makeRoute('Depth of Field', '📷', false),
   makeRoute('Pixelation', '👾', false),
diff --git a/src/core/pmndrs/ToneMapping.vue b/src/core/pmndrs/ToneMappingPmndrs.vue
similarity index 74%
rename from src/core/pmndrs/ToneMapping.vue
rename to src/core/pmndrs/ToneMappingPmndrs.vue
index 5e3fbe84..ffe561cb 100644
--- a/src/core/pmndrs/ToneMapping.vue
+++ b/src/core/pmndrs/ToneMappingPmndrs.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import { BlendFunction, ToneMappingEffect, ToneMappingMode } from 'postprocessing'
-import { defineExpose, defineProps, watchEffect, withDefaults } from 'vue'
-import { useEffect } from './composables/useEffect'
+import { defineExpose } from 'vue'
 import { makePropWatchers } from '../../util/prop'
+import { useEffectPmndrs } from './composables/useEffectPmndrs'
 
-export interface ToneMappingProps {
+export interface ToneMappingPmndrsProps {
   /**
    * The tone mapping mode.
    */
@@ -42,7 +42,7 @@ export interface ToneMappingProps {
 }
 
 const props = withDefaults(
-  defineProps<ToneMappingProps>(),
+  defineProps<ToneMappingPmndrsProps>(),
   {
     mode: ToneMappingMode.AGX,
     blendFunction: BlendFunction.SRC,
@@ -54,23 +54,18 @@ const props = withDefaults(
   },
 )
 
-const { pass, effect } = useEffect(() => new ToneMappingEffect(props), props)
+const { pass, effect } = useEffectPmndrs(() => new ToneMappingEffect(props), props)
 
 defineExpose({ pass, effect })
 
-watchEffect(() => {
-  if (!effect.value) { return }
-
-  effect.value.blendMode.blendFunction = Number(props.blendFunction)
-})
-
 makePropWatchers(
   [
     [() => props.mode, 'mode'],
+    [() => props.blendFunction, 'blendMode.blendFunction'],
     [() => props.resolution, 'resolution'],
     [() => props.averageLuminance, 'averageLuminance'],
     [() => props.middleGrey, 'middleGrey'],
-    [() => props.minLuminance, 'minLuminance'],
+    [() => props.minLuminance, 'adaptiveLuminanceMaterial.minLuminance'],
     [() => props.whitePoint, 'whitePoint'],
   ],
   effect,
diff --git a/src/core/pmndrs/index.ts b/src/core/pmndrs/index.ts
index 7bd1f5d3..7481e1d0 100644
--- a/src/core/pmndrs/index.ts
+++ b/src/core/pmndrs/index.ts
@@ -9,6 +9,7 @@ import NoisePmndrs, { type NoisePmndrsProps } from './NoisePmndrs.vue'
 import OutlinePmndrs, { type OutlinePmndrsProps } from './OutlinePmndrs.vue'
 import PixelationPmndrs, { type PixelationPmndrsProps } from './PixelationPmndrs.vue'
 import VignettePmndrs, { type VignettePmndrsProps } from './VignettePmndrs.vue'
+import ToneMappingPmndrs, { type ToneMappingPmndrsProps } from './ToneMappingPmndrs.vue'
 
 export {
   BloomPmndrs,
@@ -20,6 +21,7 @@ export {
   PixelationPmndrs,
   useEffectPmndrs,
   VignettePmndrs,
+  ToneMappingPmndrs,
 
   BloomPmndrsProps,
   DepthOfFieldPmndrsProps,
@@ -29,4 +31,5 @@ export {
   OutlinePmndrsProps,
   PixelationPmndrsProps,
   VignettePmndrsProps,
+  ToneMappingPmndrsProps,
 }