From a78262ccec406dab0473111c3768199dedb0ba37 Mon Sep 17 00:00:00 2001
From: Jean-Christophe <>
Date: Wed, 24 Jan 2024 15:45:21 +0100
Subject: [PATCH] =?UTF-8?q?modification=20et=20=C3=A9tat=20courant?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
README.md | 2 +-
src/{ => assets}/style/person.css | 0
.../{person.jsx => person.component.jsx} | 4 ++--
...isting.jsx => personListing.component.jsx} | 2 +-
src/components/person_class.jsx | 22 -------------------
5 files changed, 4 insertions(+), 26 deletions(-)
rename src/{ => assets}/style/person.css (100%)
rename src/components/{person.jsx => person.component.jsx} (80%)
rename src/components/{personListing.jsx => personListing.component.jsx} (94%)
delete mode 100644 src/components/person_class.jsx
diff --git a/README.md b/README.md
index bf5c1a2..a74c037 100644
--- a/README.md
+++ b/README.md
@@ -49,7 +49,7 @@ où `tag` peut prendre comme valeur :
* `v5.2` : modification et état courant : mise en évidence du problème
voir `/src/components/star.jsx`
* `v5.3` : modification et état courant : utilisation d'une fonction en argument de `setOn` pour modifier l'état à partir de la valeur précédente
- voir `/src/components/star.jsx`
+ voir `/src/components/star.component.jsx` et `/src/components/person.component.jsx`
Faire ```git checkout main``` pour revenir à la version finale.
diff --git a/src/style/person.css b/src/assets/style/person.css
similarity index 100%
rename from src/style/person.css
rename to src/assets/style/person.css
diff --git a/src/components/person.jsx b/src/components/person.component.jsx
similarity index 80%
rename from src/components/person.jsx
rename to src/components/person.component.jsx
index 8024779..98fefc7 100644
--- a/src/components/person.jsx
+++ b/src/components/person.component.jsx
@@ -1,7 +1,7 @@
import { useState } from 'react';
// import stysheet defining style specific to this component
-import '../style/person.css';
+import './assets/style/person.css';
/*
* define a component that uses props, props is a javascript object
@@ -11,7 +11,7 @@ const Person = ( { name = 'Anonymous' , age , delay } ) => {
const [ currentAge, setCurrentAge ] = useState(age);
// become older every delay ms
- setInterval( () => setCurrentAge( currentAge + 1 ), delay);
+ setInterval( () => setCurrentAge( previousCurrentAge => previousCurrentAge + 1 ), delay);
return (
<div className="person">Here is :
diff --git a/src/components/personListing.jsx b/src/components/personListing.component.jsx
similarity index 94%
rename from src/components/personListing.jsx
rename to src/components/personListing.component.jsx
index eca5ec7..4b7e719 100644
--- a/src/components/personListing.jsx
+++ b/src/components/personListing.component.jsx
@@ -1,6 +1,6 @@
import React from 'react';
-import Person from './person.jsx';
+import Person from './person.component.jsx';
/*
* props.persons is an Array, here we assume with at least two elements
diff --git a/src/components/person_class.jsx b/src/components/person_class.jsx
deleted file mode 100644
index 4ab55cb..0000000
--- a/src/components/person_class.jsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from 'react';
-
-import '../style/person.css';
-
-/*
- * define component as a class that extends React.component
-*/
-export default class Person extends React.Component {
- constructor(props) {
- super(props);
- }
-
- render() {
- const { name , age } = this.props;
-
- const view = <div className="person">Here is :
- <div>name : <span>{ name }</span> </div>
- <div>age : <span>{ age }</span> </div>
- </div>
- return view;
- }
-}
--
GitLab