diff --git a/packages/core/src/components/persea/resource/index.jsx b/packages/core/src/components/persea/resource/index.jsx
index c7b7b8a..e2db7a0 100644
--- a/packages/core/src/components/persea/resource/index.jsx
+++ b/packages/core/src/components/persea/resource/index.jsx
@@ -9,6 +9,7 @@ import {
import {Resource as ResourceComponent} from '@avocado/resource-persea';
import {classnames, PropTypes, React} from '@flecks/react';
import {useDispatch, useSelector} from '@flecks/redux';
+import {userIdSelector} from '@flecks/user';
import styles from './index.module.scss';
@@ -26,13 +27,34 @@ import Login from './login';
function Resource({expanded}) {
const dispatch = useDispatch();
- const project = useSelector(projectSelector) || 'c41ddaac-89c2-46a4-b3e5-1d634a1a7c36';
+ const project = useSelector(projectSelector);
const {structure} = useSelector(projectsSelector);
const {current} = useSelector(resourceSelector);
const openResources = useSelector(openResourcesSelector);
const projects = Object.entries(structure);
const selectedIndex = openResources.findIndex(({uri}) => current === uri);
const resource = useSelector((state) => projectResourceSelector(state, project, current));
+ const userId = useSelector(userIdSelector);
+ if (!project) {
+ return (
+
+ {
+ 0 !== userId
+ ? (
+
+ )
+ : (
+
+
You must log in to access your projects.
+
+
+ )
+ }
+
+ );
+ }
if (!resource) {
dispatch(fetchProjectResource({uri: current, uuid: project}));
}
diff --git a/packages/core/src/components/persea/resource/index.module.scss b/packages/core/src/components/persea/resource/index.module.scss
index a7349cf..a9415ef 100644
--- a/packages/core/src/components/persea/resource/index.module.scss
+++ b/packages/core/src/components/persea/resource/index.module.scss
@@ -9,24 +9,6 @@
width: calc(100% - 25rem);
}
- .login {
- p {
- margin: 3em;
- text-align: center;
- }
- }
-
- .none {
- color: rgba(255, 255, 255, 0.3);
- font-family: var(--thick-title-font-family);
- justify-content: space-around;
- display: flex;
- flex-direction: column;
- font-size: 2em;
- height: 100%;
- text-align: center;
- }
-
> :global(.react-tabs) {
overflow: auto;
}
@@ -35,3 +17,21 @@
.content {
flex-grow: 100;
}
+
+.login {
+ p {
+ margin: 3em;
+ text-align: center;
+ }
+}
+
+.none {
+ color: rgba(255, 255, 255, 0.3);
+ font-family: var(--thick-title-font-family);
+ justify-content: space-around;
+ display: flex;
+ flex-direction: column;
+ font-size: 2em;
+ height: 100%;
+ text-align: center;
+}
diff --git a/packages/core/src/sidebar/organization/content.jsx b/packages/core/src/sidebar/organization/content.jsx
index 5c5a062..cd990de 100644
--- a/packages/core/src/sidebar/organization/content.jsx
+++ b/packages/core/src/sidebar/organization/content.jsx
@@ -7,15 +7,25 @@ import {projectSelector, structureSelector} from '../../state';
import Organization from './organization';
function Content() {
- const project = useSelector(projectSelector) || 'c41ddaac-89c2-46a4-b3e5-1d634a1a7c36';
- const {label, resourcePaths} = useSelector((state) => structureSelector(state, project));
+ const project = useSelector(projectSelector);
+ const structure = useSelector((state) => structureSelector(state, project));
return (
-
+ {
+ project
+ ? (
+
+ )
+ : (
+
+
You don't have any projects.
+
+ )
+ }
);
}
diff --git a/packages/core/src/sidebar/organization/content.module.scss b/packages/core/src/sidebar/organization/content.module.scss
index 0b23268..92177b1 100644
--- a/packages/core/src/sidebar/organization/content.module.scss
+++ b/packages/core/src/sidebar/organization/content.module.scss
@@ -1,6 +1,14 @@
.content {
}
+.empty {
+ p {
+ font-family: var(--message-font-family);
+ margin-top: 1em;
+ text-align: center;
+ }
+}
+
.icon {
background-image: url('./icon_document.svg');
}
diff --git a/packages/core/src/sidebar/projects/content.jsx b/packages/core/src/sidebar/projects/content.jsx
index 62aa061..4027c55 100644
--- a/packages/core/src/sidebar/projects/content.jsx
+++ b/packages/core/src/sidebar/projects/content.jsx
@@ -6,7 +6,7 @@ import styles from './content.module.scss';
import {projectSelector, projectsSelector} from '../../state';
function Content() {
- const project = useSelector(projectSelector) || 'c41ddaac-89c2-46a4-b3e5-1d634a1a7c36';
+ const project = useSelector(projectSelector);
const {structure} = useSelector(projectsSelector);
const projects = Object.entries(structure);
return (
diff --git a/packages/core/src/state/project.js b/packages/core/src/state/project.js
index 7f0f817..c9533ad 100644
--- a/packages/core/src/state/project.js
+++ b/packages/core/src/state/project.js
@@ -1,7 +1,10 @@
import {
createSlice,
+ hydrateServer,
} from '@flecks/redux';
+const HydrateServer = Symbol.for('$persea/core.project');
+
export const projectSelector = (state) => state.project;
const slice = createSlice({
@@ -11,19 +14,28 @@ const slice = createSlice({
reducers: {
setProject: (state, {payload}) => payload,
},
+ extraReducers: (builder) => {
+ builder.addCase(hydrateServer, (state, {payload}) => payload.req[HydrateServer]);
+ },
/* eslint-enable no-param-reassign */
});
slice.reducer.hydrateServer = async (req) => {
const {user} = req;
if (!user) {
- return null;
+ req[HydrateServer] = null;
+ return;
}
const projects = await user.getProjects();
if (0 === projects.length) {
- return null;
+ req[HydrateServer] = null;
+ return;
}
- return projects[0].uuid;
+ req[HydrateServer] = projects[0].uuid;
};
+export const {
+ setProject,
+} = slice.actions;
+
export default slice.reducer;