create-instant-app 0.22.107 → 0.22.108-experimental.drewh-use-clone.21267754740.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +12 -11
- package/package.json +6 -3
- package/template/base/expo/README.md +0 -15
- package/template/base/expo/_env +0 -2
- package/template/base/expo/_gitignore +0 -41
- package/template/base/expo/app/+not-found.tsx +0 -16
- package/template/base/expo/app/_layout.tsx +0 -37
- package/template/base/expo/app/index.tsx +0 -64
- package/template/base/expo/app.json +0 -42
- package/template/base/expo/assets/fonts/SpaceMono-Regular.ttf +0 -0
- package/template/base/expo/assets/images/adaptive-icon.png +0 -0
- package/template/base/expo/assets/images/favicon.png +0 -0
- package/template/base/expo/assets/images/icon.png +0 -0
- package/template/base/expo/assets/images/partial-react-logo.png +0 -0
- package/template/base/expo/assets/images/react-logo.png +0 -0
- package/template/base/expo/assets/images/react-logo@2x.png +0 -0
- package/template/base/expo/assets/images/react-logo@3x.png +0 -0
- package/template/base/expo/assets/images/splash-icon.png +0 -0
- package/template/base/expo/babel.config.js +0 -12
- package/template/base/expo/constants/Colors.ts +0 -26
- package/template/base/expo/eslint.config.js +0 -10
- package/template/base/expo/expo-env.d.ts +0 -3
- package/template/base/expo/global.css +0 -3
- package/template/base/expo/hooks/useColorScheme.ts +0 -1
- package/template/base/expo/hooks/useColorScheme.web.ts +0 -21
- package/template/base/expo/hooks/useThemeColor.ts +0 -21
- package/template/base/expo/instant.perms.ts +0 -24
- package/template/base/expo/instant.schema.ts +0 -44
- package/template/base/expo/lib/db.ts +0 -7
- package/template/base/expo/metro.config.js +0 -6
- package/template/base/expo/nativewind-env.d.ts +0 -1
- package/template/base/expo/package.json +0 -56
- package/template/base/expo/scripts/reset-project.js +0 -112
- package/template/base/expo/tailwind.config.js +0 -9
- package/template/base/expo/tsconfig.json +0 -18
- package/template/base/next-js-app-dir/README.md +0 -15
- package/template/base/next-js-app-dir/_env +0 -2
- package/template/base/next-js-app-dir/_gitignore +0 -41
- package/template/base/next-js-app-dir/next-env.d.ts +0 -5
- package/template/base/next-js-app-dir/next.config.ts +0 -7
- package/template/base/next-js-app-dir/package.json +0 -26
- package/template/base/next-js-app-dir/postcss.config.mjs +0 -5
- package/template/base/next-js-app-dir/public/file.svg +0 -1
- package/template/base/next-js-app-dir/public/globe.svg +0 -1
- package/template/base/next-js-app-dir/public/next.svg +0 -1
- package/template/base/next-js-app-dir/public/vercel.svg +0 -1
- package/template/base/next-js-app-dir/public/window.svg +0 -1
- package/template/base/next-js-app-dir/src/app/favicon.ico +0 -0
- package/template/base/next-js-app-dir/src/app/globals.css +0 -26
- package/template/base/next-js-app-dir/src/app/layout.tsx +0 -34
- package/template/base/next-js-app-dir/src/app/page.tsx +0 -169
- package/template/base/next-js-app-dir/src/instant.perms.ts +0 -24
- package/template/base/next-js-app-dir/src/instant.schema.ts +0 -50
- package/template/base/next-js-app-dir/src/lib/db.ts +0 -8
- package/template/base/next-js-app-dir/tsconfig.json +0 -27
- package/template/base/vite-vanilla/README.md +0 -15
- package/template/base/vite-vanilla/_env +0 -2
- package/template/base/vite-vanilla/_gitignore +0 -25
- package/template/base/vite-vanilla/index.html +0 -13
- package/template/base/vite-vanilla/package.json +0 -19
- package/template/base/vite-vanilla/public/vite.svg +0 -1
- package/template/base/vite-vanilla/src/instant.perms.ts +0 -24
- package/template/base/vite-vanilla/src/instant.schema.ts +0 -50
- package/template/base/vite-vanilla/src/lib/db.ts +0 -11
- package/template/base/vite-vanilla/src/main.ts +0 -242
- package/template/base/vite-vanilla/src/style.css +0 -96
- package/template/base/vite-vanilla/src/typescript.svg +0 -1
- package/template/base/vite-vanilla/src/vite-env.d.ts +0 -1
- package/template/base/vite-vanilla/tsconfig.json +0 -24
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "expo-template",
|
|
3
|
-
"main": "expo-router/entry",
|
|
4
|
-
"version": "1.0.0",
|
|
5
|
-
"scripts": {
|
|
6
|
-
"start": "expo start",
|
|
7
|
-
"reset-project": "node ./scripts/reset-project.js",
|
|
8
|
-
"android": "expo start --android",
|
|
9
|
-
"ios": "expo start --ios",
|
|
10
|
-
"web": "expo start --web",
|
|
11
|
-
"lint": "expo lint"
|
|
12
|
-
},
|
|
13
|
-
"dependencies": {
|
|
14
|
-
"@expo/vector-icons": "^15.0.2",
|
|
15
|
-
"@instantdb/react-native": "latest",
|
|
16
|
-
"@instantdb/admin": "latest",
|
|
17
|
-
"@react-native-async-storage/async-storage": "^2.2.0",
|
|
18
|
-
"@react-native-community/netinfo": "^11.4.1",
|
|
19
|
-
"@react-navigation/bottom-tabs": "^7.4.0",
|
|
20
|
-
"@react-navigation/elements": "^2.6.3",
|
|
21
|
-
"@react-navigation/native": "^7.1.8",
|
|
22
|
-
"expo": "~54.0.8",
|
|
23
|
-
"expo-constants": "~18.0.9",
|
|
24
|
-
"expo-font": "~14.0.8",
|
|
25
|
-
"expo-haptics": "~15.0.7",
|
|
26
|
-
"expo-image": "~3.0.8",
|
|
27
|
-
"expo-linking": "~8.0.8",
|
|
28
|
-
"expo-router": "~6.0.6",
|
|
29
|
-
"expo-splash-screen": "~31.0.10",
|
|
30
|
-
"expo-status-bar": "~3.0.8",
|
|
31
|
-
"expo-symbols": "~1.0.7",
|
|
32
|
-
"expo-system-ui": "~6.0.7",
|
|
33
|
-
"expo-web-browser": "~15.0.7",
|
|
34
|
-
"nativewind": "^4.1.23",
|
|
35
|
-
"prettier-plugin-tailwindcss": "^0.5.14",
|
|
36
|
-
"react": "19.1.0",
|
|
37
|
-
"react-dom": "19.1.0",
|
|
38
|
-
"react-native": "0.81.4",
|
|
39
|
-
"react-native-get-random-values": "^1.11.0",
|
|
40
|
-
"react-native-gesture-handler": "~2.28.0",
|
|
41
|
-
"react-native-worklets": "0.5.1",
|
|
42
|
-
"react-native-reanimated": "~4.1.1",
|
|
43
|
-
"react-native-safe-area-context": "~5.6.0",
|
|
44
|
-
"react-native-screens": "~4.16.0",
|
|
45
|
-
"react-native-web": "~0.21.0",
|
|
46
|
-
"tailwindcss": "^3.4.17"
|
|
47
|
-
},
|
|
48
|
-
"devDependencies": {
|
|
49
|
-
"@babel/core": "^7.25.2",
|
|
50
|
-
"@types/react": "~19.1.0",
|
|
51
|
-
"eslint": "^9.25.0",
|
|
52
|
-
"eslint-config-expo": "~10.0.0",
|
|
53
|
-
"typescript": "~5.9.2"
|
|
54
|
-
},
|
|
55
|
-
"private": true
|
|
56
|
-
}
|
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
#!/usr/bin/env node
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* This script is used to reset the project to a blank state.
|
|
5
|
-
* It deletes or moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example based on user input and creates a new /app directory with an index.tsx and _layout.tsx file.
|
|
6
|
-
* You can remove the `reset-project` script from package.json and safely delete this file after running it.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
const fs = require("fs");
|
|
10
|
-
const path = require("path");
|
|
11
|
-
const readline = require("readline");
|
|
12
|
-
|
|
13
|
-
const root = process.cwd();
|
|
14
|
-
const oldDirs = ["app", "components", "hooks", "constants", "scripts"];
|
|
15
|
-
const exampleDir = "app-example";
|
|
16
|
-
const newAppDir = "app";
|
|
17
|
-
const exampleDirPath = path.join(root, exampleDir);
|
|
18
|
-
|
|
19
|
-
const indexContent = `import { Text, View } from "react-native";
|
|
20
|
-
|
|
21
|
-
export default function Index() {
|
|
22
|
-
return (
|
|
23
|
-
<View
|
|
24
|
-
style={{
|
|
25
|
-
flex: 1,
|
|
26
|
-
justifyContent: "center",
|
|
27
|
-
alignItems: "center",
|
|
28
|
-
}}
|
|
29
|
-
>
|
|
30
|
-
<Text>Edit app/index.tsx to edit this screen.</Text>
|
|
31
|
-
</View>
|
|
32
|
-
);
|
|
33
|
-
}
|
|
34
|
-
`;
|
|
35
|
-
|
|
36
|
-
const layoutContent = `import { Stack } from "expo-router";
|
|
37
|
-
|
|
38
|
-
export default function RootLayout() {
|
|
39
|
-
return <Stack />;
|
|
40
|
-
}
|
|
41
|
-
`;
|
|
42
|
-
|
|
43
|
-
const rl = readline.createInterface({
|
|
44
|
-
input: process.stdin,
|
|
45
|
-
output: process.stdout,
|
|
46
|
-
});
|
|
47
|
-
|
|
48
|
-
const moveDirectories = async (userInput) => {
|
|
49
|
-
try {
|
|
50
|
-
if (userInput === "y") {
|
|
51
|
-
// Create the app-example directory
|
|
52
|
-
await fs.promises.mkdir(exampleDirPath, { recursive: true });
|
|
53
|
-
console.log(`📁 /${exampleDir} directory created.`);
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
// Move old directories to new app-example directory or delete them
|
|
57
|
-
for (const dir of oldDirs) {
|
|
58
|
-
const oldDirPath = path.join(root, dir);
|
|
59
|
-
if (fs.existsSync(oldDirPath)) {
|
|
60
|
-
if (userInput === "y") {
|
|
61
|
-
const newDirPath = path.join(root, exampleDir, dir);
|
|
62
|
-
await fs.promises.rename(oldDirPath, newDirPath);
|
|
63
|
-
console.log(`➡️ /${dir} moved to /${exampleDir}/${dir}.`);
|
|
64
|
-
} else {
|
|
65
|
-
await fs.promises.rm(oldDirPath, { recursive: true, force: true });
|
|
66
|
-
console.log(`❌ /${dir} deleted.`);
|
|
67
|
-
}
|
|
68
|
-
} else {
|
|
69
|
-
console.log(`➡️ /${dir} does not exist, skipping.`);
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
// Create new /app directory
|
|
74
|
-
const newAppDirPath = path.join(root, newAppDir);
|
|
75
|
-
await fs.promises.mkdir(newAppDirPath, { recursive: true });
|
|
76
|
-
console.log("\n📁 New /app directory created.");
|
|
77
|
-
|
|
78
|
-
// Create index.tsx
|
|
79
|
-
const indexPath = path.join(newAppDirPath, "index.tsx");
|
|
80
|
-
await fs.promises.writeFile(indexPath, indexContent);
|
|
81
|
-
console.log("📄 app/index.tsx created.");
|
|
82
|
-
|
|
83
|
-
// Create _layout.tsx
|
|
84
|
-
const layoutPath = path.join(newAppDirPath, "_layout.tsx");
|
|
85
|
-
await fs.promises.writeFile(layoutPath, layoutContent);
|
|
86
|
-
console.log("📄 app/_layout.tsx created.");
|
|
87
|
-
|
|
88
|
-
console.log("\n✅ Project reset complete. Next steps:");
|
|
89
|
-
console.log(
|
|
90
|
-
`1. Run \`npx expo start\` to start a development server.\n2. Edit app/index.tsx to edit the main screen.${
|
|
91
|
-
userInput === "y"
|
|
92
|
-
? `\n3. Delete the /${exampleDir} directory when you're done referencing it.`
|
|
93
|
-
: ""
|
|
94
|
-
}`
|
|
95
|
-
);
|
|
96
|
-
} catch (error) {
|
|
97
|
-
console.error(`❌ Error during script execution: ${error.message}`);
|
|
98
|
-
}
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
rl.question(
|
|
102
|
-
"Do you want to move existing files to /app-example instead of deleting them? (Y/n): ",
|
|
103
|
-
(answer) => {
|
|
104
|
-
const userInput = answer.trim().toLowerCase() || "y";
|
|
105
|
-
if (userInput === "y" || userInput === "n") {
|
|
106
|
-
moveDirectories(userInput).finally(() => rl.close());
|
|
107
|
-
} else {
|
|
108
|
-
console.log("❌ Invalid input. Please enter 'Y' or 'N'.");
|
|
109
|
-
rl.close();
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
);
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"extends": "expo/tsconfig.base",
|
|
3
|
-
"compilerOptions": {
|
|
4
|
-
"strict": true,
|
|
5
|
-
"paths": {
|
|
6
|
-
"@/*": [
|
|
7
|
-
"./*"
|
|
8
|
-
]
|
|
9
|
-
}
|
|
10
|
-
},
|
|
11
|
-
"include": [
|
|
12
|
-
"**/*.ts",
|
|
13
|
-
"**/*.tsx",
|
|
14
|
-
".expo/types/**/*.ts",
|
|
15
|
-
"expo-env.d.ts",
|
|
16
|
-
"nativewind-env.d.ts"
|
|
17
|
-
]
|
|
18
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
# Welcome to your InstantDB NextJS app 👋
|
|
2
|
-
|
|
3
|
-
This is a NextJS project scaffolded with create-instant-app.
|
|
4
|
-
|
|
5
|
-
To run the development server:
|
|
6
|
-
`npm run dev`
|
|
7
|
-
|
|
8
|
-
To push schema changes:
|
|
9
|
-
`npx instant-cli push`
|
|
10
|
-
|
|
11
|
-
To pull schema changes:
|
|
12
|
-
`npx instant-cli pull`
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
Got any feedback or questions? Join our [Discord](https://discord.gg/hgVf9R6SBm)
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
|
2
|
-
|
|
3
|
-
# dependencies
|
|
4
|
-
/node_modules
|
|
5
|
-
/.pnp
|
|
6
|
-
.pnp.*
|
|
7
|
-
.yarn/*
|
|
8
|
-
!.yarn/patches
|
|
9
|
-
!.yarn/plugins
|
|
10
|
-
!.yarn/releases
|
|
11
|
-
!.yarn/versions
|
|
12
|
-
|
|
13
|
-
# testing
|
|
14
|
-
/coverage
|
|
15
|
-
|
|
16
|
-
# next.js
|
|
17
|
-
/.next/
|
|
18
|
-
/out/
|
|
19
|
-
|
|
20
|
-
# production
|
|
21
|
-
/build
|
|
22
|
-
|
|
23
|
-
# misc
|
|
24
|
-
.DS_Store
|
|
25
|
-
*.pem
|
|
26
|
-
|
|
27
|
-
# debug
|
|
28
|
-
npm-debug.log*
|
|
29
|
-
yarn-debug.log*
|
|
30
|
-
yarn-error.log*
|
|
31
|
-
.pnpm-debug.log*
|
|
32
|
-
|
|
33
|
-
# env files (can opt-in for committing if needed)
|
|
34
|
-
.env*
|
|
35
|
-
|
|
36
|
-
# vercel
|
|
37
|
-
.vercel
|
|
38
|
-
|
|
39
|
-
# typescript
|
|
40
|
-
*.tsbuildinfo
|
|
41
|
-
next-env.d.ts
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "app-dir",
|
|
3
|
-
"version": "0.1.0",
|
|
4
|
-
"private": true,
|
|
5
|
-
"scripts": {
|
|
6
|
-
"dev": "next dev --turbopack",
|
|
7
|
-
"build": "next build",
|
|
8
|
-
"start": "next start",
|
|
9
|
-
"lint": "next lint"
|
|
10
|
-
},
|
|
11
|
-
"dependencies": {
|
|
12
|
-
"@instantdb/react": "latest",
|
|
13
|
-
"@instantdb/admin": "latest",
|
|
14
|
-
"next": "15.4.10",
|
|
15
|
-
"react": "19.1.0",
|
|
16
|
-
"react-dom": "19.1.0"
|
|
17
|
-
},
|
|
18
|
-
"devDependencies": {
|
|
19
|
-
"@tailwindcss/postcss": "^4",
|
|
20
|
-
"@types/node": "^20",
|
|
21
|
-
"@types/react": "^19",
|
|
22
|
-
"@types/react-dom": "^19",
|
|
23
|
-
"tailwindcss": "^4",
|
|
24
|
-
"typescript": "^5.9.3"
|
|
25
|
-
}
|
|
26
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
|
|
Binary file
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
@import "tailwindcss";
|
|
2
|
-
|
|
3
|
-
:root {
|
|
4
|
-
--background: #ffffff;
|
|
5
|
-
--foreground: #171717;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
@theme inline {
|
|
9
|
-
--color-background: var(--background);
|
|
10
|
-
--color-foreground: var(--foreground);
|
|
11
|
-
--font-sans: var(--font-geist-sans);
|
|
12
|
-
--font-mono: var(--font-geist-mono);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
@media (prefers-color-scheme: dark) {
|
|
16
|
-
:root {
|
|
17
|
-
--background: #0a0a0a;
|
|
18
|
-
--foreground: #ededed;
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
body {
|
|
23
|
-
background: var(--background);
|
|
24
|
-
color: var(--foreground);
|
|
25
|
-
font-family: Arial, Helvetica, sans-serif;
|
|
26
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import type { Metadata } from 'next';
|
|
2
|
-
import { Geist, Geist_Mono } from 'next/font/google';
|
|
3
|
-
import './globals.css';
|
|
4
|
-
|
|
5
|
-
const geistSans = Geist({
|
|
6
|
-
variable: '--font-geist-sans',
|
|
7
|
-
subsets: ['latin'],
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
const geistMono = Geist_Mono({
|
|
11
|
-
variable: '--font-geist-mono',
|
|
12
|
-
subsets: ['latin'],
|
|
13
|
-
});
|
|
14
|
-
|
|
15
|
-
export const metadata: Metadata = {
|
|
16
|
-
title: 'Create Instant App',
|
|
17
|
-
description: 'Instant DB Starter App',
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
export default function RootLayout({
|
|
21
|
-
children,
|
|
22
|
-
}: Readonly<{
|
|
23
|
-
children: React.ReactNode;
|
|
24
|
-
}>) {
|
|
25
|
-
return (
|
|
26
|
-
<html lang="en">
|
|
27
|
-
<body
|
|
28
|
-
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
|
29
|
-
>
|
|
30
|
-
{children}
|
|
31
|
-
</body>
|
|
32
|
-
</html>
|
|
33
|
-
);
|
|
34
|
-
}
|
|
@@ -1,169 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import { db } from "@/lib/db";
|
|
4
|
-
import { type AppSchema } from "@/instant.schema";
|
|
5
|
-
import { id, InstaQLEntity } from "@instantdb/react";
|
|
6
|
-
|
|
7
|
-
type Todo = InstaQLEntity<AppSchema, "todos">;
|
|
8
|
-
|
|
9
|
-
const room = db.room("todos");
|
|
10
|
-
|
|
11
|
-
function App() {
|
|
12
|
-
// Read Data
|
|
13
|
-
const { isLoading, error, data } = db.useQuery({ todos: {} });
|
|
14
|
-
const { peers } = db.rooms.usePresence(room);
|
|
15
|
-
const numUsers = 1 + Object.keys(peers).length;
|
|
16
|
-
if (isLoading) {
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
if (error) {
|
|
20
|
-
return <div className="text-red-500 p-4">Error: {error.message}</div>;
|
|
21
|
-
}
|
|
22
|
-
const { todos } = data;
|
|
23
|
-
return (
|
|
24
|
-
<div className="font-mono min-h-screen flex justify-center items-center flex-col space-y-4">
|
|
25
|
-
<div className="text-xs text-gray-500">
|
|
26
|
-
Number of users online: {numUsers}
|
|
27
|
-
</div>
|
|
28
|
-
<h2 className="tracking-wide text-5xl text-gray-300">todos</h2>
|
|
29
|
-
<div className="border border-gray-300 max-w-xs w-full">
|
|
30
|
-
<TodoForm todos={todos} />
|
|
31
|
-
<TodoList todos={todos} />
|
|
32
|
-
<ActionBar todos={todos} />
|
|
33
|
-
</div>
|
|
34
|
-
<div className="text-xs text-center">
|
|
35
|
-
Open another tab to see todos update in realtime!
|
|
36
|
-
</div>
|
|
37
|
-
</div>
|
|
38
|
-
);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
// Write Data
|
|
42
|
-
// ---------
|
|
43
|
-
function addTodo(text: string) {
|
|
44
|
-
db.transact(
|
|
45
|
-
db.tx.todos[id()].update({
|
|
46
|
-
text,
|
|
47
|
-
done: false,
|
|
48
|
-
createdAt: Date.now(),
|
|
49
|
-
}),
|
|
50
|
-
);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
function deleteTodo(todo: Todo) {
|
|
54
|
-
db.transact(db.tx.todos[todo.id].delete());
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
function toggleDone(todo: Todo) {
|
|
58
|
-
db.transact(db.tx.todos[todo.id].update({ done: !todo.done }));
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
function deleteCompleted(todos: Todo[]) {
|
|
62
|
-
const completed = todos.filter((todo) => todo.done);
|
|
63
|
-
const txs = completed.map((todo) => db.tx.todos[todo.id].delete());
|
|
64
|
-
db.transact(txs);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
function toggleAll(todos: Todo[]) {
|
|
68
|
-
const newVal = !todos.every((todo) => todo.done);
|
|
69
|
-
db.transact(
|
|
70
|
-
todos.map((todo) => db.tx.todos[todo.id].update({ done: newVal })),
|
|
71
|
-
);
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
// Components
|
|
75
|
-
// ----------
|
|
76
|
-
function ChevronDownIcon() {
|
|
77
|
-
return (
|
|
78
|
-
<svg viewBox="0 0 20 20">
|
|
79
|
-
<path
|
|
80
|
-
d="M5 8 L10 13 L15 8"
|
|
81
|
-
stroke="currentColor"
|
|
82
|
-
fill="none"
|
|
83
|
-
strokeWidth="2"
|
|
84
|
-
/>
|
|
85
|
-
</svg>
|
|
86
|
-
);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
function TodoForm({ todos }: { todos: Todo[] }) {
|
|
90
|
-
return (
|
|
91
|
-
<div className="flex items-center h-10 border-b border-gray-300">
|
|
92
|
-
<button
|
|
93
|
-
className="h-full px-2 border-r border-gray-300 flex items-center justify-center"
|
|
94
|
-
onClick={() => toggleAll(todos)}
|
|
95
|
-
>
|
|
96
|
-
<div className="w-5 h-5">
|
|
97
|
-
<ChevronDownIcon />
|
|
98
|
-
</div>
|
|
99
|
-
</button>
|
|
100
|
-
<form
|
|
101
|
-
className="flex-1 h-full"
|
|
102
|
-
onSubmit={(e) => {
|
|
103
|
-
e.preventDefault();
|
|
104
|
-
const input = e.currentTarget.input as HTMLInputElement;
|
|
105
|
-
addTodo(input.value);
|
|
106
|
-
input.value = "";
|
|
107
|
-
}}
|
|
108
|
-
>
|
|
109
|
-
<input
|
|
110
|
-
className="w-full h-full px-2 outline-none bg-transparent"
|
|
111
|
-
autoFocus
|
|
112
|
-
placeholder="What needs to be done?"
|
|
113
|
-
type="text"
|
|
114
|
-
name="input"
|
|
115
|
-
/>
|
|
116
|
-
</form>
|
|
117
|
-
</div>
|
|
118
|
-
);
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
function TodoList({ todos }: { todos: Todo[] }) {
|
|
122
|
-
return (
|
|
123
|
-
<div className="divide-y divide-gray-300">
|
|
124
|
-
{todos.map((todo) => (
|
|
125
|
-
<div key={todo.id} className="flex items-center h-10">
|
|
126
|
-
<div className="h-full px-2 flex items-center justify-center">
|
|
127
|
-
<div className="w-5 h-5 flex items-center justify-center">
|
|
128
|
-
<input
|
|
129
|
-
type="checkbox"
|
|
130
|
-
className="cursor-pointer"
|
|
131
|
-
checked={todo.done}
|
|
132
|
-
onChange={() => toggleDone(todo)}
|
|
133
|
-
/>
|
|
134
|
-
</div>
|
|
135
|
-
</div>
|
|
136
|
-
<div className="flex-1 px-2 overflow-hidden flex items-center">
|
|
137
|
-
{todo.done ? (
|
|
138
|
-
<span className="line-through">{todo.text}</span>
|
|
139
|
-
) : (
|
|
140
|
-
<span>{todo.text}</span>
|
|
141
|
-
)}
|
|
142
|
-
</div>
|
|
143
|
-
<button
|
|
144
|
-
className="h-full px-2 flex items-center justify-center text-gray-300 hover:text-gray-500"
|
|
145
|
-
onClick={() => deleteTodo(todo)}
|
|
146
|
-
>
|
|
147
|
-
X
|
|
148
|
-
</button>
|
|
149
|
-
</div>
|
|
150
|
-
))}
|
|
151
|
-
</div>
|
|
152
|
-
);
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
function ActionBar({ todos }: { todos: Todo[] }) {
|
|
156
|
-
return (
|
|
157
|
-
<div className="flex justify-between items-center h-10 px-2 text-xs border-t border-gray-300">
|
|
158
|
-
<div>Remaining todos: {todos.filter((todo) => !todo.done).length}</div>
|
|
159
|
-
<button
|
|
160
|
-
className=" text-gray-300 hover:text-gray-500"
|
|
161
|
-
onClick={() => deleteCompleted(todos)}
|
|
162
|
-
>
|
|
163
|
-
Delete Completed
|
|
164
|
-
</button>
|
|
165
|
-
</div>
|
|
166
|
-
);
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
export default App;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
// Docs: https://www.instantdb.com/docs/permissions
|
|
2
|
-
|
|
3
|
-
import type { InstantRules } from "@instantdb/react";
|
|
4
|
-
|
|
5
|
-
const rules = {
|
|
6
|
-
/**
|
|
7
|
-
* Welcome to Instant's permission system!
|
|
8
|
-
* Right now your rules are empty. To start filling them in, check out the docs:
|
|
9
|
-
* https://www.instantdb.com/docs/permissions
|
|
10
|
-
*
|
|
11
|
-
* Here's an example to give you a feel:
|
|
12
|
-
* posts: {
|
|
13
|
-
* allow: {
|
|
14
|
-
* view: "true",
|
|
15
|
-
* create: "isOwner",
|
|
16
|
-
* update: "isOwner",
|
|
17
|
-
* delete: "isOwner",
|
|
18
|
-
* },
|
|
19
|
-
* bind: ["isOwner", "auth.id != null && auth.id == data.ownerId"],
|
|
20
|
-
* },
|
|
21
|
-
*/
|
|
22
|
-
} satisfies InstantRules;
|
|
23
|
-
|
|
24
|
-
export default rules;
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
// Docs: https://www.instantdb.com/docs/modeling-data
|
|
2
|
-
|
|
3
|
-
import { i } from "@instantdb/react";
|
|
4
|
-
|
|
5
|
-
const _schema = i.schema({
|
|
6
|
-
entities: {
|
|
7
|
-
$files: i.entity({
|
|
8
|
-
path: i.string().unique().indexed(),
|
|
9
|
-
url: i.string(),
|
|
10
|
-
}),
|
|
11
|
-
$users: i.entity({
|
|
12
|
-
email: i.string().unique().indexed().optional(),
|
|
13
|
-
imageURL: i.string().optional(),
|
|
14
|
-
type: i.string().optional(),
|
|
15
|
-
}),
|
|
16
|
-
todos: i.entity({
|
|
17
|
-
text: i.string(),
|
|
18
|
-
done: i.boolean(),
|
|
19
|
-
createdAt: i.number(),
|
|
20
|
-
}),
|
|
21
|
-
},
|
|
22
|
-
links: {
|
|
23
|
-
$usersLinkedPrimaryUser: {
|
|
24
|
-
forward: {
|
|
25
|
-
on: "$users",
|
|
26
|
-
has: "one",
|
|
27
|
-
label: "linkedPrimaryUser",
|
|
28
|
-
onDelete: "cascade",
|
|
29
|
-
},
|
|
30
|
-
reverse: {
|
|
31
|
-
on: "$users",
|
|
32
|
-
has: "many",
|
|
33
|
-
label: "linkedGuestUsers",
|
|
34
|
-
},
|
|
35
|
-
},
|
|
36
|
-
},
|
|
37
|
-
rooms: {
|
|
38
|
-
todos: {
|
|
39
|
-
presence: i.entity({}),
|
|
40
|
-
},
|
|
41
|
-
},
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
// This helps TypeScript display nicer intellisense
|
|
45
|
-
type _AppSchema = typeof _schema;
|
|
46
|
-
interface AppSchema extends _AppSchema {}
|
|
47
|
-
const schema: AppSchema = _schema;
|
|
48
|
-
|
|
49
|
-
export type { AppSchema };
|
|
50
|
-
export default schema;
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
"target": "ES2017",
|
|
4
|
-
"lib": ["dom", "dom.iterable", "esnext"],
|
|
5
|
-
"allowJs": true,
|
|
6
|
-
"skipLibCheck": true,
|
|
7
|
-
"strict": true,
|
|
8
|
-
"noEmit": true,
|
|
9
|
-
"esModuleInterop": true,
|
|
10
|
-
"module": "esnext",
|
|
11
|
-
"moduleResolution": "bundler",
|
|
12
|
-
"resolveJsonModule": true,
|
|
13
|
-
"isolatedModules": true,
|
|
14
|
-
"jsx": "preserve",
|
|
15
|
-
"incremental": true,
|
|
16
|
-
"plugins": [
|
|
17
|
-
{
|
|
18
|
-
"name": "next"
|
|
19
|
-
}
|
|
20
|
-
],
|
|
21
|
-
"paths": {
|
|
22
|
-
"@/*": ["./src/*"]
|
|
23
|
-
}
|
|
24
|
-
},
|
|
25
|
-
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
|
26
|
-
"exclude": ["node_modules"]
|
|
27
|
-
}
|