DAW#87 Restructuring (see App.tsx)

.env.local

@@ -0,0 +1,4 @@
+
+#*** @Stripe *#
+NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_51LBfSOLjx992qWAYRekYCPRpgZ3xa6POoteqC7Tp9555GXDGEcm67xHgOQt20N9vTrXaerlfKQdTcxZreijcvwI300GL0SnTOR
+STRIPE_SECRET=sk_test_51LBfSOLjx992qWAYx8s062kh2dqbNsjbH6Po0xL93bZjeOKZyFCtxNzQ0gyFNCSOWYLSi45miRAZS6olA3epsayv00C9LKNqPB

.eslintrc.json

@@ -3,9 +3,7 @@
   "overrides": [
     {
       "files": ["**/*.test.ts", "**/*.test.tsx"],
-      "env": {
-        "jest": true
-      }
+      "env": {}
     }
   ],
   "rules": {

.gitignore

@@ -4,6 +4,7 @@ node_modules/
 
 # Next.js
 .*.env
+.*.env.local
 .next/
 .swc/
 .vercel

next.config.js

@@ -1,46 +1,45 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  experimental: { serverActions: true },
   async headers() {
     return [
       {
-        source: "/(.*)", // Apply these headers to all routes
+        source: '/(.*)', // Apply these headers to all routes
         headers: [
           /* {
             key: "Content-Security-Policy",
             value: "default-src 'self'; script-src 'self'; style-src 'self'",
           }, */
           {
-            key: "X-Content-Type-Options",
-            value: "nosniff",
+            key: 'X-Content-Type-Options',
+            value: 'nosniff',
           },
           {
-            key: "X-Frame-Options",
-            value: "DENY",
+            key: 'X-Frame-Options',
+            value: 'DENY',
           },
           {
-            key: "X-XSS-Protection",
-            value: "1; mode=block",
+            key: 'X-XSS-Protection',
+            value: '1; mode=block',
           },
           {
-            key: "Strict-Transport-Security",
-            value: "max-age=31536000; includeSubDomains; preload",
+            key: 'Strict-Transport-Security',
+            value: 'max-age=31536000; includeSubDomains; preload',
           },
           {
-            key: "Referrer-Policy",
-            value: "no-referrer",
+            key: 'Referrer-Policy',
+            value: 'no-referrer',
           },
           {
-            key: "Feature-Policy",
+            key: 'Feature-Policy',
             value: "geolocation 'none'; camera 'none'; microphone 'none'",
           },
           /* {
             key: "Access-Control-Allow-Origin",
             value: "https://trusted-domain.com",
           }, */
           {
-            key: "X-Content-Type-Options",
-            value: "nosniff",
+            key: 'X-Content-Type-Options',
+            value: 'nosniff',
           },
           /* {
             key: "Expect-CT",

package.json

@@ -29,6 +29,7 @@
     "@nextui-org/react": "^2.1.13",
     "@react-hook/window-size": "^3.1.1",
     "@spotify/basic-pitch": "^1.0.1",
+    "@stripe/stripe-js": "^2.1.10",
     "@tensorflow/tfjs": "^4.12.0",
     "@types/node": "^20.8.9",
     "@types/react": "18.2.33",
@@ -49,6 +50,8 @@
     "react-dom": "^18.2.0",
     "react-useportal": "^1.0.18",
     "reactflow": "^11.9.4",
+    "server-only": "^0.0.1",
+    "stripe": "^14.2.0",
     "swr": "^2.2.4",
     "tailwindcss": "3.3.5",
     "tonal": "^5.0.0",

src/app/_common/constants.tsx

@@ -7,6 +7,7 @@ import { ETrackType, type ITrack } from 'app/_common/types/track.types';
 import type { IChannel } from './types/channel.types';
 import { EInstrument } from './types/instrument.types';
 import { Note } from 'tone/build/esm/core/type/NoteUnits';
+import { Subdivision } from 'tone/build/esm/core/type/Units';
 
 // ---------- General
 /*** @constants */
@@ -43,30 +44,21 @@ export const PROGRESSION = [
   // Montgomery Ward bridge
   'I IV ii V',
 ];
-export const ROMAN_NUMS = ['i', 'ii', 'iii', 'iv', 'v', 'vi', 'vii'];
-
-// ---------- Utils
-/*** @utils */
 export const getMaxNotes = (notes: Note[][]) =>
   Math.max(notes.reduce((a, b) => (a > b.length ? a : b.length), 0));
-export const getMeasureTime = (n: number) => Tone.Time(`${n}m`);
-export const getMeasureSeconds = (n: number) => getMeasureTime(n).toSeconds();
-export const getNotationTime = (n: number) => Tone.Time(`${n}n`);
-export const getNotationSeconds = (n: number) => getNotationTime(n).toSeconds();
-export const isRomanNum = (s: string) => ROMAN_NUMS.includes(_.toLower(s));
 
 // ---------- Project
-const DEFAULT_ACTIVE_TRACK_ID = 'track-bd';
+const DEFAULT_ACTIVE_TRACK_ID = 'audio-halloween';
 const DEFAULT_BPM = 120;
 const DEFAULT_CLEF = 'D';
 const DEFAULT_SCALE = 'minor';
 const DEFAULT_MEASURE_COUNT = 2;
 const DEFAULT_NAME = t('untitled');
-const DEFAULT_OFFSET_LEFT = 184;
+const DEFAULT_OFFSET_LEFT = 179;
 const DEFAULT_POSITION = '0:0:0';
 const DEFAULT_QUANTIZATION = 16;
 const DEFAULT_SWING = 0;
-const DEFAULT_SWING_SUBDIVISION = '8n';
+const DEFAULT_SWING_SUBDIVISION: Subdivision = '8n';
 const DEFAULT_STATES = {
   tabTopActive: 0,
   tabBtmActive: 0,