diff --git a/index.html b/index.html new file mode 100644 index 0000000..0a9c2c1 --- /dev/null +++ b/index.html @@ -0,0 +1,15 @@ + + + + + + HSCStack - Study Resources Preview + + + + + +
+ + + diff --git a/package.json b/package.json index 3736f55..c84dae2 100644 --- a/package.json +++ b/package.json @@ -1,65 +1,66 @@ { - "$schema": "https://www.schemastore.org/package.json", - "private": true, - "type": "module", - "scripts": { - "build": "vite build", - "build:ssr": "vite build && vite build --ssr", - "dev": "composer run dev", - "dev:server": "vite", - "format": "prettier --write resources/", - "format:check": "prettier --check resources/", - "lint": "eslint . --fix", - "lint:check": "eslint .", - "types:check": "vue-tsc --noEmit", - "prepare": "husky" - }, - "lint-staged": { - "resources/**/*.{js,ts,vue,css}": [ - "prettier --write", - "eslint --fix" - ] - }, - "devDependencies": { - "@eslint/js": "^9.19.0", - "@laravel/vite-plugin-wayfinder": "^0.1.3", - "@stylistic/eslint-plugin": "^5.10.0", - "@types/node": "^22.13.5", - "@vitejs/plugin-vue-jsx": "^5.1.6", - "@vue/eslint-config-typescript": "^14.3.0", - "eslint": "^9.17.0", - "eslint-config-prettier": "^10.1.8", - "eslint-import-resolver-typescript": "^4.4.4", - "eslint-plugin-import": "^2.32.0", - "eslint-plugin-vue": "^9.32.0", - "husky": "^9.1.7", - "lint-staged": "^17.4.1", - "prettier": "^3.4.2", - "prettier-plugin-tailwindcss": "^0.6.11", - "typescript-eslint": "^8.23.0", - "vite-plugin-pwa": "^1.3.0", - "vue-tsc": "^2.2.4" - }, - "dependencies": { - "@inertiajs/vite": "^3.0.0", - "@inertiajs/vue3": "^3.0.0", - "@tailwindcss/vite": "^4.1.11", - "@vitejs/plugin-vue": "^6.0.0", - "clsx": "^2.1.1", - "concurrently": "^9.0.1", - "laravel-echo": "^2.4.0", - "laravel-vite-plugin": "^3.1", - "lucide-vue-next": "^1.0.0", - "pusher-js": "^8.6.0", - "tailwind-merge": "^3.2.0", - "tailwindcss": "^4.1.1", - "typescript": "^5.2.2", - "vite": "^8.0.0", - "vue": "^3.5.13" - }, - "optionalDependencies": { - "@rollup/rollup-linux-x64-gnu": "4.9.5", - "@tailwindcss/oxide-linux-x64-gnu": "^4.0.1", - "lightningcss-linux-x64-gnu": "^1.29.1" - } + "$schema": "https://www.schemastore.org/package.json", + "private": true, + "type": "module", + "scripts": { + "build": "vite build", + "build:ssr": "vite build && vite build --ssr", + "dev": "composer run dev", + "dev:server": "vite", + "preview:local": "node preview-server.js", + "format": "prettier --write resources/", + "format:check": "prettier --check resources/", + "lint": "eslint . --fix", + "lint:check": "eslint .", + "types:check": "vue-tsc --noEmit", + "prepare": "husky" + }, + "lint-staged": { + "resources/**/*.{js,ts,vue,css}": [ + "prettier --write", + "eslint --fix" + ] + }, + "devDependencies": { + "@eslint/js": "^9.19.0", + "@laravel/vite-plugin-wayfinder": "^0.1.3", + "@stylistic/eslint-plugin": "^5.10.0", + "@types/node": "^22.13.5", + "@vitejs/plugin-vue-jsx": "^5.1.6", + "@vue/eslint-config-typescript": "^14.3.0", + "eslint": "^9.17.0", + "eslint-config-prettier": "^10.1.8", + "eslint-import-resolver-typescript": "^4.4.4", + "eslint-plugin-import": "^2.32.0", + "eslint-plugin-vue": "^9.32.0", + "husky": "^9.1.7", + "lint-staged": "^17.4.1", + "prettier": "^3.4.2", + "prettier-plugin-tailwindcss": "^0.6.11", + "typescript-eslint": "^8.23.0", + "vite-plugin-pwa": "^1.3.0", + "vue-tsc": "^2.2.4" + }, + "dependencies": { + "@inertiajs/vite": "^3.0.0", + "@inertiajs/vue3": "^3.0.0", + "@tailwindcss/vite": "^4.1.11", + "@vitejs/plugin-vue": "^6.0.0", + "clsx": "^2.1.1", + "concurrently": "^9.0.1", + "laravel-echo": "^2.4.0", + "laravel-vite-plugin": "^3.1", + "lucide-vue-next": "^1.0.0", + "pusher-js": "^8.6.0", + "tailwind-merge": "^3.2.0", + "tailwindcss": "^4.1.1", + "typescript": "^5.2.2", + "vite": "^8.0.0", + "vue": "^3.5.13" + }, + "optionalDependencies": { + "@rollup/rollup-linux-x64-gnu": "4.9.5", + "@tailwindcss/oxide-linux-x64-gnu": "^4.0.1", + "lightningcss-linux-x64-gnu": "^1.29.1" + } } diff --git a/preview-server.js b/preview-server.js new file mode 100644 index 0000000..0ec6323 --- /dev/null +++ b/preview-server.js @@ -0,0 +1,38 @@ +import path from 'node:path'; +import { fileURLToPath } from 'node:url'; +import tailwindcss from '@tailwindcss/vite'; +import vue from '@vitejs/plugin-vue'; +import vueJsx from '@vitejs/plugin-vue-jsx'; +import { createServer } from 'vite'; + +const __dirname = path.dirname(fileURLToPath(import.meta.url)); + +const server = await createServer({ + configFile: false, + root: __dirname, + plugins: [ + tailwindcss(), + vue({ + template: { + transformAssetUrls: { + base: null, + includeAbsolute: false, + }, + }, + }), + vueJsx(), + ], + resolve: { + alias: { + '@': path.resolve(__dirname, 'resources/js'), + }, + }, + server: { + port: 3000, + host: 'localhost', + strictPort: false, + }, +}); + +await server.listen(); +server.printUrls(); diff --git a/resources/js/components/ResourceFilterBar.vue b/resources/js/components/ResourceFilterBar.vue new file mode 100644 index 0000000..c8ab584 --- /dev/null +++ b/resources/js/components/ResourceFilterBar.vue @@ -0,0 +1,809 @@ + + + + + diff --git a/resources/js/pages/Node.vue b/resources/js/pages/Node.vue index 2199412..9701388 100644 --- a/resources/js/pages/Node.vue +++ b/resources/js/pages/Node.vue @@ -7,6 +7,7 @@ import AuthModal from '@/components/AuthModal.vue'; import BreadcrumbNav from '@/components/BreadcrumbNav.vue'; import EmptyState from '@/components/EmptyState.vue'; import NodeRow from '@/components/NodeRow.vue'; +import ResourceFilterBar from '@/components/ResourceFilterBar.vue'; import ResourceRow from '@/components/ResourceRow.vue'; import UserListItem from '@/components/UserListItem.vue'; import { useAuth } from '@/lib/useAuth'; @@ -68,6 +69,17 @@ const totalItemsCount = computed( () => (props.nodes?.length ?? 0) + (props.resources?.length ?? 0), ); +// Filtered Resources State (controlled by ResourceFilterBar) +const filteredResources = ref([...(props.resources || [])]); + +watch( + () => props.resources, + (newRes) => { + filteredResources.value = [...(newRes || [])]; + }, + { immediate: true }, +); + // Modals const showUpvotersModal = ref(false); @@ -382,6 +394,15 @@ const handleVote = (type: 'up' | 'down') => { + + +
@@ -400,10 +421,23 @@ const handleVote = (type: 'up' | 'down') => { :node="node" /> +
+ +
{ + (NodePage as any).layout = (NodePage as any).layout || AppLayout; + + return NodePage; + }, + setup({ el, App, props, plugin }) { + createApp({ render: () => h(App, props) }) + .use(plugin) + .mount(el); + }, +});