ref: #187 update 09 - 11 pending update readme async await

Author: lokeeto

hooks/09_Sidebar/Readme.md

@@ -89,9 +89,10 @@ _./webpack.config.js_
 +        {
 +          loader: 'css-loader',
 +          options: {
-+            modules: true,
-+            localIdentName: '[name]__[local]___[hash:base64:5]',
-+            camelCase: true,
++            modules: {
++              localIdentName: "[name]__[local]___[hash:base64:5]",
++            },
++            localsConvention: "camelCase",
 +          },
 +        },
 +      ]

hooks/10_TableMock/webpack.config.js

@@ -37,7 +37,7 @@ module.exports = {
       {
         test: /\.css$/,
         include: /node_modules/,
-        use: [MiniCssExtractPlugin.loader, "css-loader"]
+        use: [MiniCssExtractPlugin.loader, "css-loader"],
       },
       {
         test: /\.css$/,
@@ -47,9 +47,10 @@ module.exports = {
           {
             loader: "css-loader",
             options: {
-              modules: true,
-              localIdentName: "[name]__[local]___[hash:base64:5]",
-              camelCase: true,
+              modules: {
+                localIdentName: "[name]__[local]___[hash:base64:5]",
+              },
+              localsConvention: "camelCase",
             },
           },
         ],

hooks/11_TableAxios/src/components/memberTable.tsx

@@ -7,10 +7,9 @@ const useMemberCollection = () => {
     MemberEntity[]
   >([]);
 
-  const loadMemberCollection = () => {
-    getMembersCollection().then(memberCollection =>
-      setMemberCollection(memberCollection)
-    );
+  const loadMemberCollection = async () => {
+    const memberCollection = await getMembersCollection();
+    setMemberCollection(memberCollection);
   };
 
   return { memberCollection, loadMemberCollection };
@@ -34,7 +33,7 @@ export const MemberTableComponent = () => {
           </tr>
         </thead>
         <tbody>
-          {memberCollection.map(member => (
+          {memberCollection.map((member) => (
             <MemberRow key={member.id} member={member} />
           ))}
         </tbody>

hooks/11_TableAxios/webpack.config.js

@@ -34,6 +34,11 @@ module.exports = {
           babelCore: "@babel/core", // needed for Babel v7
         },
       },
+      {
+        test: /\.css$/,
+        include: /node_modules/,
+        use: [MiniCssExtractPlugin.loader, "css-loader"],
+      },
       {
         test: /\.css$/,
         exclude: /node_modules/,
@@ -42,9 +47,10 @@ module.exports = {
           {
             loader: "css-loader",
             options: {
-              modules: true,
-              localIdentName: "[name]__[local]___[hash:base64:5]",
-              camelCase: true,
+              modules: {
+                localIdentName: "[name]__[local]___[hash:base64:5]",
+              },
+              localsConvention: "camelCase",
             },
           },
         ],