cleanup

examples/getting-started/getting-started-project/src/components/islands/WeatherForecast.tsx

@@ -79,7 +79,7 @@ export default function WeatherForecast({
           </div>
         </>
       ) : (
-        <h2>No data available for {city || 'this area'}</h2>
+        <h2>No data found, please search another location</h2>
       )}
     </div>
   );

examples/getting-started/getting-started-project/src/components/modules/Footer/index.tsx

@@ -1,8 +1,19 @@
-export function Component() {
-  return <div>Footer</div>;
+import { ModuleFields, TextField } from '@hubspot/cms-components/fields';
+import footerStyles from '../../../styles/footer.module.css';
+
+export function Component({ fieldValues }: any) {
+  return (
+    <footer className={footerStyles.footer}>
+      <p>{fieldValues.footerText}</p>
+    </footer>
+  );
 }
 
-export const fields = [];
+export const fields = (
+  <ModuleFields>
+    <TextField label="Footer Text" name="footerText" default="Be Well." />
+  </ModuleFields>
+);
 
 export const meta = {
   label: 'Footer Module',

examples/getting-started/getting-started-project/src/components/modules/Header/index.tsx

@@ -8,7 +8,7 @@ import {
 import logo from '../../../assets/sprocket.svg';
 import headerStyles from '../../../styles/header.module.css';
 
-export function Component({ fieldValues }) {
+export function Component({ fieldValues }: any) {
   return (
     <header className={headerStyles.wrapper}>
       <nav>
@@ -19,7 +19,7 @@ export function Component({ fieldValues }) {
   );
 }
 
-const DEFAULT_MENU_ID = '53522818668';
+const DEFAULT_MENU_ID = '<YOUR_DEFAULT_MENU_ID';
 
 export const fields = (
   <ModuleFields>

examples/getting-started/getting-started-project/src/styles/footer.module.css

@@ -0,0 +1,5 @@
+.footer {
+  text-align: center;
+  font-weight: bold;
+  font-size: 2em;
+}

examples/getting-started/getting-started-project/src/styles/header.module.css

@@ -1,8 +1,3 @@
-:root {
-  --primary-color: #ff7a59;
-  --accent-color: #2d3e50;
-}
-
 .wrapper {
   width: 100%;
   background-color: transparent;

examples/getting-started/getting-started-project/src/styles/weather.module.css

@@ -2,7 +2,6 @@
   --primary-color: #ff7a59;
   --primary-color-dark: #e66e50;
   --primary-color-med: #ffbcac;
-  --primary-color-light: #fff1ee;
   --secondary-color: #dfe3eb;
   --accent-color: #2d3e50;
   --light-accent-color: #eaf0f6;

examples/getting-started/getting-started-project/src/tsconfig.json

@@ -1,21 +1,18 @@
 {
   "compilerOptions": {
-    "target": "ES2017",
+    "target": "esnext",
     "module": "Node16",
-    "moduleResolution": "node16",
-    "strict": true,
+    "moduleResolution": "Node16",
     "esModuleInterop": true,
-    "skipLibCheck": true,
+    "allowSyntheticDefaultImports": true,
     "forceConsistentCasingInFileNames": true,
     "allowImportingTsExtensions": true,
     "noEmit": true,
+    "isolatedModules": true,
     "jsx": "react-jsx",
-    "plugins": [
-      {
-        "name": "typescript-plugin-css-modules"
-      }
-    ]
+    "skipLibCheck": true,
+    "types": ["vite/client", "vitest/globals"]
   },
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "display": "Recommended"
+  "include": ["components/**/*"],
+  "exclude": ["node_modules"]
 }

examples/getting-started/getting-started-project/src/utils.ts

@@ -67,7 +67,7 @@ export function getWeatherIcon(type: string) {
   }
 }
 
-const apiKey = '20c6efc89fmshc5028f84c47f8a1p19a4a7jsnf3fead1e08a5';
+const apiKey = '<YOUR_API_KEY>';
 
 const baseApiUrl = 'https://weatherapi-com.p.rapidapi.com/forecast.json';
 const options = {