chore: ded
This commit is contained in:
parent
909e73df13
commit
b921668931
|
@ -1,31 +0,0 @@
|
||||||
import './index.scss';
|
|
||||||
|
|
||||||
import {React} from '@flecks/react';
|
|
||||||
import {useSelector} from '@flecks/redux';
|
|
||||||
|
|
||||||
import {projectsSelector} from '../../state/projects';
|
|
||||||
import ProjectItem from './project-item';
|
|
||||||
|
|
||||||
const Dashboard = React.memo(() => {
|
|
||||||
const {structure} = useSelector(projectsSelector);
|
|
||||||
const items = Object.entries(structure)
|
|
||||||
.map(([uuid, project]) => (
|
|
||||||
<ProjectItem
|
|
||||||
key={uuid}
|
|
||||||
project={project}
|
|
||||||
uuid={uuid}
|
|
||||||
/>
|
|
||||||
));
|
|
||||||
return (
|
|
||||||
<div className="dashboard">
|
|
||||||
<h2 className="dashboard__title">Dashboard</h2>
|
|
||||||
{items}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
Dashboard.displayName = 'Dashboard';
|
|
||||||
|
|
||||||
Dashboard.propTypes = {};
|
|
||||||
|
|
||||||
export default Dashboard;
|
|
|
@ -1,26 +0,0 @@
|
||||||
import './index.scss';
|
|
||||||
|
|
||||||
import {
|
|
||||||
PropTypes,
|
|
||||||
React,
|
|
||||||
} from '@flecks/react';
|
|
||||||
import {Link} from '@flecks/react/router';
|
|
||||||
|
|
||||||
import {propTypes as projectPropTypes} from '../../project';
|
|
||||||
|
|
||||||
const ProjectItem = React.memo(({project: {label, resourcePaths}, uuid}) => (
|
|
||||||
<Link className="project-item" to={`/project/${uuid}`}>
|
|
||||||
<h2 className="project-item__title">{label}</h2>
|
|
||||||
<div className="project-item__uuid">{uuid}</div>
|
|
||||||
<div className="project-item__resourceCount">{resourcePaths.length}</div>
|
|
||||||
</Link>
|
|
||||||
));
|
|
||||||
|
|
||||||
ProjectItem.displayName = 'ProjectItem';
|
|
||||||
|
|
||||||
ProjectItem.propTypes = {
|
|
||||||
project: projectPropTypes.isRequired,
|
|
||||||
uuid: PropTypes.string.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ProjectItem;
|
|
|
@ -1,83 +0,0 @@
|
||||||
import {
|
|
||||||
IconPages,
|
|
||||||
} from '@avocado/react';
|
|
||||||
import {
|
|
||||||
useResourceController,
|
|
||||||
} from '@avocado/resource-persea';
|
|
||||||
import {
|
|
||||||
classnames,
|
|
||||||
PropTypes,
|
|
||||||
React,
|
|
||||||
useRef,
|
|
||||||
useState,
|
|
||||||
} from '@flecks/react';
|
|
||||||
import {useParams} from '@flecks/react/router';
|
|
||||||
import {
|
|
||||||
useSelector,
|
|
||||||
} from '@flecks/redux';
|
|
||||||
|
|
||||||
import {structureSelector} from '../../state/projects';
|
|
||||||
import ResourceRoute from '../resource/route';
|
|
||||||
import Organization from './organization';
|
|
||||||
|
|
||||||
import locals from './index.module.scss';
|
|
||||||
|
|
||||||
function Project({uuid}) {
|
|
||||||
const {'*': reactRouterV6IsStupid} = useParams();
|
|
||||||
const [, ...uriParts] = reactRouterV6IsStupid.split('/');
|
|
||||||
const uri = `/${uriParts.join('/')}`;
|
|
||||||
useParams().uri = uri;
|
|
||||||
const [currentPageIndex, setCurrentPageIndex] = useState(0);
|
|
||||||
const ref = useRef();
|
|
||||||
const {label, resourcePaths} = useSelector((state) => structureSelector(state, uuid));
|
|
||||||
const iconPages = [];
|
|
||||||
// Organization
|
|
||||||
iconPages.push({
|
|
||||||
Icon: (
|
|
||||||
<svg viewBox="0 0 512 512">
|
|
||||||
<path d="m512 312v-160h-230v62h-152v-54h100v-160h-230v160h90v294h192v58h230v-160h-230v62h-152v-160h152v58zm-472-272h150v80h-150zm282 352h150v80h-150zm0-200h150v80h-150zm0 0" />
|
|
||||||
</svg>
|
|
||||||
),
|
|
||||||
Page: (
|
|
||||||
<Organization
|
|
||||||
label={label}
|
|
||||||
uuid={uuid}
|
|
||||||
resourcePaths={resourcePaths}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
});
|
|
||||||
const {className} = useResourceController(uri);
|
|
||||||
// Resource
|
|
||||||
iconPages.push({
|
|
||||||
Icon: (
|
|
||||||
<div className={classnames(locals.resource, className)} />
|
|
||||||
),
|
|
||||||
Page: (
|
|
||||||
<ResourceRoute uri={uri} uuid={uuid} />
|
|
||||||
),
|
|
||||||
});
|
|
||||||
return (
|
|
||||||
<div className={locals.project} ref={ref}>
|
|
||||||
<IconPages
|
|
||||||
iconsAreBelow={false}
|
|
||||||
iconPages={iconPages}
|
|
||||||
index={currentPageIndex}
|
|
||||||
onIndexChanged={setCurrentPageIndex}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export const propTypes = PropTypes.shape({
|
|
||||||
label: PropTypes.string.isRequired,
|
|
||||||
// eslint-disable-next-line react/forbid-prop-types
|
|
||||||
resourcePaths: PropTypes.arrayOf(PropTypes.any).isRequired,
|
|
||||||
});
|
|
||||||
|
|
||||||
Project.displayName = 'Project';
|
|
||||||
|
|
||||||
Project.propTypes = {
|
|
||||||
uuid: PropTypes.string.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Project;
|
|
|
@ -1,24 +0,0 @@
|
||||||
.project {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.floater {
|
|
||||||
flex-grow: 1;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.resource {
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: contain;
|
|
||||||
height: 100%;
|
|
||||||
transform: scale(2, 2);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.room {
|
|
||||||
background-image: url('./map.png');
|
|
||||||
}
|
|
Binary file not shown.
Before Width: | Height: | Size: 5.5 KiB |
|
@ -1,22 +0,0 @@
|
||||||
import './index.scss';
|
|
||||||
|
|
||||||
import {join} from 'path';
|
|
||||||
|
|
||||||
import {Resource} from '@avocado/resource';
|
|
||||||
import {React} from '@flecks/react';
|
|
||||||
import {useParams} from '@flecks/react/router';
|
|
||||||
|
|
||||||
import Project from '../index';
|
|
||||||
|
|
||||||
const ProjectRoute = () => {
|
|
||||||
const {'*': reactRouterV6IsStupid} = useParams();
|
|
||||||
const [uuid] = reactRouterV6IsStupid.split('/');
|
|
||||||
Resource.root = join('/projects', uuid);
|
|
||||||
return <Project uuid={uuid} />;
|
|
||||||
};
|
|
||||||
|
|
||||||
ProjectRoute.displayName = 'ProjectRoute';
|
|
||||||
|
|
||||||
ProjectRoute.propTypes = {};
|
|
||||||
|
|
||||||
export default ProjectRoute;
|
|
|
@ -1,31 +0,0 @@
|
||||||
import './index.scss';
|
|
||||||
|
|
||||||
import {Resource} from '@avocado/resource-persea';
|
|
||||||
import {PropTypes, React} from '@flecks/react';
|
|
||||||
import {
|
|
||||||
useDispatch,
|
|
||||||
useSelector,
|
|
||||||
} from '@flecks/redux';
|
|
||||||
import {
|
|
||||||
fetchProjectResource,
|
|
||||||
resourceSelector,
|
|
||||||
} from '../../../state/projects';
|
|
||||||
|
|
||||||
const ResourceRoute = ({uri, uuid}) => {
|
|
||||||
const dispatch = useDispatch();
|
|
||||||
const resource = useSelector((state) => resourceSelector(state, uuid, uri));
|
|
||||||
if (!resource) {
|
|
||||||
dispatch(fetchProjectResource({uri, uuid}));
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return <Resource resource={resource} />;
|
|
||||||
};
|
|
||||||
|
|
||||||
ResourceRoute.displayName = 'ResourceRoute';
|
|
||||||
|
|
||||||
ResourceRoute.propTypes = {
|
|
||||||
uri: PropTypes.string.isRequired,
|
|
||||||
uuid: PropTypes.string.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ResourceRoute;
|
|
Loading…
Reference in New Issue
Block a user