mirror of
https://github.com/philipredstone/relnet.git
synced 2025-06-16 20:51:16 +02:00
Refactor relationship types to single class and add more
Took 38 minutes
This commit is contained in:
parent
0333d37aae
commit
c31b5c5b14
@ -47,7 +47,7 @@ import {
|
||||
|
||||
// Import visible canvas graph component
|
||||
import CanvasGraph from './CanvasGraph';
|
||||
import { RELATIONSHIP_COLORS, RELATIONSHIP_LABELS, RELATIONSHIP_TYPES } from '../types/RelationShipTypes';
|
||||
import { getRelationshipColor, RELATIONSHIP_TYPES, RELATIONSHIPS } from '../types/RelationShipTypes';
|
||||
import { FormErrors, PersonNode } from '../interfaces/IPersonNode';
|
||||
|
||||
|
||||
@ -112,7 +112,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
const [editPerson, setEditPerson] = useState<PersonNode | null>(null);
|
||||
|
||||
const [newRelationship, setNewRelationship] = useState({
|
||||
source: '', target: '', type: 'freund' as RELATIONSHIP_TYPES, customType: '', notes: '', bidirectional: true,
|
||||
source: '', target: '', type: 'friend' as RELATIONSHIP_TYPES, customType: '', notes: '', bidirectional: true,
|
||||
});
|
||||
|
||||
// Filter states
|
||||
@ -375,7 +375,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
|
||||
// Create edges
|
||||
const graphEdges = relationships.map(rel => {
|
||||
const color = RELATIONSHIP_COLORS[rel.type] || RELATIONSHIP_COLORS.custom;
|
||||
const color = RELATIONSHIPS[rel.type as RELATIONSHIP_TYPES]?.color || RELATIONSHIPS.custom.color;
|
||||
const width = rel.type === 'partner' ? 4 : rel.type === 'familie' ? 3 : 2;
|
||||
|
||||
// Highlight edges connected to selected node
|
||||
@ -515,7 +515,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
|
||||
// Reset form and close modal
|
||||
setNewRelationship({
|
||||
source: '', target: '', type: 'freund', customType: '', notes: '', bidirectional: true,
|
||||
source: '', target: '', type: 'friend', customType: '', notes: '', bidirectional: true,
|
||||
});
|
||||
|
||||
setRelationshipModalOpen(false);
|
||||
@ -751,14 +751,14 @@ const FriendshipNetwork: React.FC = () => {
|
||||
<CardBody>
|
||||
<h3 className="font-medium mb-2 text-indigo-400">Legend</h3>
|
||||
<div className="space-y-2">
|
||||
{Object.entries(RELATIONSHIP_COLORS).map(([type, color]) => (
|
||||
{Object.entries(RELATIONSHIPS).map(([type, { label, color }]) => (
|
||||
<div key={type} className="flex items-center text-sm">
|
||||
<div
|
||||
className="w-4 h-4 rounded-full mr-2"
|
||||
style={{ backgroundColor: color }}
|
||||
></div>
|
||||
<span className="capitalize">
|
||||
{RELATIONSHIP_LABELS[type as RELATIONSHIP_TYPES]}
|
||||
{RELATIONSHIPS[type]?.label}
|
||||
</span>
|
||||
</div>))}
|
||||
</div>
|
||||
@ -892,7 +892,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
>
|
||||
All Types
|
||||
</button>
|
||||
{Object.entries(RELATIONSHIP_COLORS).map(([type, color]) => (<button
|
||||
{Object.entries(RELATIONSHIPS).map(([type, { label, color }]) => (<button
|
||||
key={type}
|
||||
className={`px-3 py-1 text-xs rounded-full whitespace-nowrap flex items-center ${relationshipTypeFilter === type ? 'bg-indigo-600 text-white' : 'bg-slate-700 text-slate-300 hover:bg-slate-600'}`}
|
||||
onClick={() => setRelationshipTypeFilter(type as RELATIONSHIP_TYPES)}
|
||||
@ -902,7 +902,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
style={{ backgroundColor: color }}
|
||||
></span>
|
||||
<span className="capitalize">
|
||||
{RELATIONSHIP_LABELS[type as RELATIONSHIP_TYPES]}
|
||||
{RELATIONSHIPS[type as RELATIONSHIP_TYPES]?.label}
|
||||
</span>
|
||||
</button>))}
|
||||
</div>
|
||||
@ -947,10 +947,10 @@ const FriendshipNetwork: React.FC = () => {
|
||||
<div className="flex items-center text-xs text-slate-400 mt-1">
|
||||
<span
|
||||
className="inline-block w-2 h-2 rounded-full mr-1"
|
||||
style={{ backgroundColor: RELATIONSHIP_COLORS[rel.type] }}
|
||||
style={{ backgroundColor: RELATIONSHIPS[rel.type as RELATIONSHIP_TYPES]?.color }}
|
||||
></span>
|
||||
<span className="capitalize">
|
||||
{rel.type === 'custom' ? rel.customType : RELATIONSHIP_LABELS[rel.type]}
|
||||
{rel.type === 'custom' ? rel.customType : RELATIONSHIPS[rel.type as RELATIONSHIP_TYPES]?.label}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -1253,7 +1253,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
...newRelationship, type: e.target.value as RELATIONSHIP_TYPES,
|
||||
})}
|
||||
>
|
||||
{Object.entries(RELATIONSHIP_LABELS).map(([value, label]) => (<option key={value} value={value}>
|
||||
{Object.entries(RELATIONSHIPS).map(([value, { label }]) => (<option key={value} value={value}>
|
||||
{label}
|
||||
</option>))}
|
||||
</select>
|
||||
@ -1449,7 +1449,7 @@ const FriendshipNetwork: React.FC = () => {
|
||||
<div className="flex items-center">
|
||||
<span
|
||||
className="inline-block w-2 h-2 rounded-full mr-2"
|
||||
style={{ backgroundColor: RELATIONSHIP_COLORS[rel.type] }}
|
||||
style={{ backgroundColor: RELATIONSHIPS[rel.type as RELATIONSHIP_TYPES]?.color }}
|
||||
></span>
|
||||
<span className="text-sm">
|
||||
{isSource ? 'To: ' : 'From: '}
|
||||
@ -1466,7 +1466,9 @@ const FriendshipNetwork: React.FC = () => {
|
||||
>
|
||||
{otherPerson.firstName} {otherPerson.lastName}
|
||||
</span>
|
||||
{rel.type === 'custom' ? ` (${rel.customType})` : ` (${RELATIONSHIP_LABELS[rel.type]})`}
|
||||
{rel.type === 'custom'
|
||||
? ` (${rel.customType})`
|
||||
: ` (${RELATIONSHIPS[rel.type as RELATIONSHIP_TYPES]?.label})`}
|
||||
</span>
|
||||
</div>
|
||||
<button
|
||||
|
||||
@ -6,8 +6,8 @@ import {
|
||||
removeRelationship,
|
||||
updateRelationship,
|
||||
} from '../api/relationships';
|
||||
import { RELATIONSHIP_TYPES } from '../types/RelationShipTypes';
|
||||
import { Relationship } from '../interfaces/IRelationship';
|
||||
import { RELATIONSHIP_TYPES } from '../types/RelationShipTypes';
|
||||
|
||||
interface PersonNode extends Person {
|
||||
// Additional properties needed for the visualization
|
||||
@ -343,7 +343,7 @@ export const useFriendshipNetwork = (
|
||||
const updateRelationshipData = async (
|
||||
relationshipId: string,
|
||||
relationshipData: {
|
||||
type?: 'freund' | 'partner' | 'familie' | 'arbeitskolleg' | 'custom';
|
||||
type?: RELATIONSHIP_TYPES;
|
||||
customType?: string;
|
||||
},
|
||||
): Promise<RelationshipEdge> => {
|
||||
|
||||
@ -1,11 +1,15 @@
|
||||
export type RELATIONSHIP_TYPES = 'freund' | 'partner' | 'familie' | 'arbeitskolleg' | 'custom';
|
||||
export const RELATIONSHIP_LABELS = {
|
||||
freund: 'Friend', partner: 'Partner', familie: 'Family', arbeitskolleg: 'Colleague', custom: 'Custom',
|
||||
}; // Graph appearance constants
|
||||
export const RELATIONSHIP_COLORS = {
|
||||
freund: '#60A5FA', // Light blue
|
||||
partner: '#F472B6', // Pink
|
||||
familie: '#34D399', // Green
|
||||
arbeitskolleg: '#FBBF24', // Yellow
|
||||
custom: '#9CA3AF', // Gray
|
||||
};
|
||||
export type RELATIONSHIP_TYPES = 'acquaintance' | 'friend' | 'partner' | 'family' | 'secondDegree' | 'colleague' | 'teacher' | 'exPartner' | 'custom';
|
||||
|
||||
export const RELATIONSHIPS: Record<RELATIONSHIP_TYPES, { label: string; color: string }> = {
|
||||
acquaintance: { label: 'Bekannter', color: '#60A5FA' }, // Light blue
|
||||
friend: { label: 'Freund', color: '#60A5FA' }, // Light blue
|
||||
partner: { label: 'Partner', color: '#F472B6' }, // Pink
|
||||
family: { label: 'Familie', color: '#34D399' }, // Green
|
||||
secondDegree: { label: 'Verwandter', color: '#34D399' }, // Green
|
||||
colleague: { label: 'Kollege/Klassenkamerad', color: '#FBBF24' }, // Yellow
|
||||
teacher: { label: 'Lehrer', color: '#FBBF24' }, // Yellow
|
||||
exPartner: { label: 'Ex-Partner', color: '#ce8c13' }, // Orange
|
||||
custom: { label: 'Benutzerdefiniert', color: '#9CA3AF' }, // Gray
|
||||
};
|
||||
export const getRelationshipLabel = (type: RELATIONSHIP_TYPES): string => RELATIONSHIPS[type].label;
|
||||
export const getRelationshipColor = (type: RELATIONSHIP_TYPES): string => RELATIONSHIPS[type].color;
|
||||
|
||||
@ -217,12 +217,12 @@ const createSampleDemoNetwork = async (userId: mongoose.Types.ObjectId | string)
|
||||
|
||||
// Create relationships between people
|
||||
const relationships = [
|
||||
{ source: 'JohnSmith', target: 'EmmaJohnson', type: 'freund' },
|
||||
{ source: 'EmmaJohnson', target: 'MichaelWilliams', type: 'familie' },
|
||||
{ source: 'MichaelWilliams', target: 'SarahBrown', type: 'arbeitskolleg' },
|
||||
{ source: 'SarahBrown', target: 'DavidJones', type: 'freund' },
|
||||
{ source: 'JohnSmith', target: 'EmmaJohnson', type: 'friend' },
|
||||
{ source: 'EmmaJohnson', target: 'MichaelWilliams', type: 'family' },
|
||||
{ source: 'MichaelWilliams', target: 'SarahBrown', type: 'colleague' },
|
||||
{ source: 'SarahBrown', target: 'DavidJones', type: 'friend' },
|
||||
{ source: 'DavidJones', target: 'LisaGarcia', type: 'partner' },
|
||||
{ source: 'JohnSmith', target: 'DavidJones', type: 'arbeitskolleg' },
|
||||
{ source: 'JohnSmith', target: 'DavidJones', type: 'colleague' },
|
||||
];
|
||||
|
||||
// Create each relationship
|
||||
|
||||
@ -1,5 +1,10 @@
|
||||
import mongoose, { Document, Schema } from 'mongoose';
|
||||
|
||||
|
||||
export const RELATIONSHIP_TYPES = [
|
||||
'acquaintance', 'friend', 'partner', 'family', 'secondDegree', 'colleague', 'teacher', 'exPartner', 'custom',
|
||||
];
|
||||
|
||||
export interface IRelationship extends Document {
|
||||
_id: string;
|
||||
source: mongoose.Types.ObjectId;
|
||||
@ -24,7 +29,7 @@ const RelationshipSchema = new Schema(
|
||||
type: {
|
||||
type: String,
|
||||
required: [true, 'Relationship type is required'],
|
||||
enum: ['freund', 'partner', 'familie', 'arbeitskolleg', 'custom'],
|
||||
enum: RELATIONSHIP_TYPES,
|
||||
},
|
||||
customType: {
|
||||
type: String,
|
||||
@ -36,7 +41,7 @@ const RelationshipSchema = new Schema(
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
{ timestamps: true }
|
||||
{ timestamps: true },
|
||||
);
|
||||
|
||||
// Create compound index to ensure unique relationships in a network
|
||||
|
||||
@ -3,6 +3,8 @@ import { check } from 'express-validator';
|
||||
import * as relationshipController from '../controllers/relationship.controller';
|
||||
import { auth } from '../middleware/auth.middleware';
|
||||
import { checkNetworkAccess } from '../middleware/network-access.middleware';
|
||||
import { RELATIONSHIP_TYPES } from '../models/relationship.model';
|
||||
|
||||
|
||||
const router = express.Router();
|
||||
|
||||
@ -22,13 +24,7 @@ router.post(
|
||||
[
|
||||
check('source', 'Source person ID is required').not().isEmpty().isMongoId(),
|
||||
check('target', 'Target person ID is required').not().isEmpty().isMongoId(),
|
||||
check('type', 'Relationship type is required').isIn([
|
||||
'freund',
|
||||
'partner',
|
||||
'familie',
|
||||
'arbeitskolleg',
|
||||
'custom',
|
||||
]),
|
||||
check('type', 'Relationship type is required').isIn(RELATIONSHIP_TYPES),
|
||||
check('customType', 'Custom type is required when type is custom')
|
||||
.if(check('type').equals('custom'))
|
||||
.not()
|
||||
@ -45,7 +41,7 @@ router.put(
|
||||
[
|
||||
check('type', 'Relationship type must be valid if provided')
|
||||
.optional()
|
||||
.isIn(['freund', 'partner', 'familie', 'arbeitskolleg', 'custom']),
|
||||
.isIn(RELATIONSHIP_TYPES),
|
||||
check('customType', 'Custom type is required when type is custom')
|
||||
.if(check('type').equals('custom'))
|
||||
.not()
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user