Rename test to template, switch to functional components

Author: stanlemon

apps/test/.eslintrc.json apps/template/.eslintrc.json

@@ -1,5 +1,9 @@
 {
-  "name": "@stanlemon/app-test",
+  "name": "@stanlemon/app-template",
+  "version": "0.1.0",
+  "description": "A template for creating apps using the webdev package.",
+  "author": "Stan Lemon <stanlemon@users.noreply.github.com>",
+  "license": "MIT",
   "type": "module",
   "scripts": {
     "start": "webpack serve",
@@ -9,9 +13,6 @@
     "lint:format": "eslint --fix --ext js,jsx,ts,tsx ./src/"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.36",
-    "@fortawesome/free-solid-svg-icons": "^5.15.4",
-    "@fortawesome/react-fontawesome": "^0.1.16",
     "@stanlemon/webdev": "*"
   }
-}
+}

apps/test/index.html apps/template/index.html

@@ -0,0 +1,5 @@
+@primaryFont: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+
+body {
+  font-family: @primaryFont;
+}

apps/test/jest.config.js apps/template/jest.config.js

@@ -0,0 +1,37 @@
+import React, { useState } from "react";
+import "./App.less";
+
+function Input({ onClick }) {
+  const [value, setValue] = useState("");
+
+  const handleClick = () => {
+    onClick(value);
+    setValue("");
+  };
+
+  return (
+    <>
+      <input
+        type="text"
+        onChange={(e) => setValue(e.currentTarget.value)}
+        value={value}
+      />
+      <button onClick={handleClick}>Add</button>
+    </>
+  );
+}
+
+export default function App() {
+  const [items, setItems] = useState([]);
+  return (
+    <div>
+      <h1>Hello World!</h1>
+      <Input onClick={(item) => setItems([...items, item])} />
+      <ul>
+        {items.map((item, i) => (
+          <li key={i}>{item}</li>
+        ))}
+      </ul>
+    </div>
+  );
+}