antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-13 07:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixed some profile setting issues

Browse Source
This commit is contained in:
Anton Tranelis 2024-05-02 10:56:58 +02:00
parent 6e26435b87
commit 321bd393f8
1 changed files with 39 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
src/Components/Profile/OverlayItemProfileSettings.tsx
View File

@ -12,15 +12,11 @@ import { randomColor } from '../../Utils/RandomColor';
import { useLocation, useNavigate } from 'react-router-dom'; import { useLocation, useNavigate } from 'react-router-dom';
import { Item, Tag } from '../../types'; import { Item, Tag } from '../../types';
import { MapOverlayPage } from '../Templates'; import { MapOverlayPage } from '../Templates';
import { AvatarWidget } from './AvatarWidget'; import { AvatarWidget } from './AvatarWidget';
import { encodeTag } from '../../Utils/FormatTags'; import { encodeTag } from '../../Utils/FormatTags';
import { useLayers } from '../Map/hooks/useLayers'; import { useLayers } from '../Map/hooks/useLayers';
import { TagsWidget } from './TagsWidget'; import { TagsWidget } from './TagsWidget';
import { LinkedItemsHeaderView } from './LinkedItemsHeaderView';
import { TextView } from '../Map/Subcomponents/ItemPopupComponents/TextView';
import { ActionButton } from './ActionsButton';
import { useHasUserPermission } from '../Map/hooks/usePermissions';
export function OverlayItemProfileSettings() { export function OverlayItemProfileSettings() {
@ -33,20 +29,13 @@ export function OverlayItemProfileSettings() {
const [color, setColor] = useState<string>(""); const [color, setColor] = useState<string>("");
const [offers, setOffers] = useState<Array<Tag>>([]); const [offers, setOffers] = useState<Array<Tag>>([]);
const [needs, setNeeds] = useState<Array<Tag>>([]); const [needs, setNeeds] = useState<Array<Tag>>([]);
const [updatePermission, setUpdatePermission] = useState<boolean>(false);
const [relations, setRelations] = useState<Array<Item>>([]);
const [activeTab, setActiveTab] = useState<number>(1); const [activeTab, setActiveTab] = useState<number>(1);
const [loading, setLoading] = useState<boolean>(false); const [loading, setLoading] = useState<boolean>(false);
const { user } = useAuth(); const { user } = useAuth();
const hasUserPermission = useHasUserPermission();
const updateItem = useUpdateItem(); const updateItem = useUpdateItem();
const addItem = useAddItem(); const addItem = useAddItem();
const layers = useLayers(); const layers = useLayers();
@ -57,16 +46,20 @@ export function OverlayItemProfileSettings() {
const addTag = useAddTag(); const addTag = useAddTag();
const navigate = useNavigate(); const navigate = useNavigate();
const items = useItems(); const items = useItems();
const [item, setItem] = useState<Item>({} as Item) const [item, setItem] = useState<Item>({} as Item)
useEffect(() => { useEffect(() => {
const itemId = location.pathname.split("/")[2]; const itemId = location.pathname.split("/")[2];
const item = items.find(i => i.id === itemId);
item && setItem(item);
!item && setItem({ id: crypto.randomUUID(), name: user ? user.first_name : "", text: "" })
}, [location, items, activeTab]) const item = items.find(i => i.id === itemId);
item && setItem(item);
const layer = layers.find(l => l.itemType.name == "user")
!item && setItem({ id: crypto.randomUUID(), name: user ? user.first_name : "", text: "", layer: layer, new: true })
}, [items])
const updateActiveTab = (id: number) => { const updateActiveTab = (id: number) => {
setActiveTab(id); setActiveTab(id);
@ -86,7 +79,7 @@ export function OverlayItemProfileSettings() {
React.useEffect(() => { useEffect(() => {
if (item.layer?.itemColorField) setColor(getValue(item, item.layer?.itemColorField)); if (item.layer?.itemColorField) setColor(getValue(item, item.layer?.itemColorField));
else setColor(item.layer?.markerDefaultColor || "#3D3846") else setColor(item.layer?.markerDefaultColor || "#3D3846")
@ -105,54 +98,60 @@ export function OverlayItemProfileSettings() {
const need = tags.find(t => t.id === o.tags_id); const need = tags.find(t => t.id === o.tags_id);
need && setNeeds(current => [...current, need]) need && setNeeds(current => [...current, need])
}) })
setRelations([]);
item.relations?.map(r => {
const item = items.find(i => i.id == r.related_items_id)
item && setRelations(current => [...current, item])
})
item && item.user_created && hasUserPermission("items", "update", item) && setUpdatePermission(true);
}, [item]) }, [item])
useEffect(() => {
console.log(offers);
console.log(needs);
console.log(subname)
}, [offers, needs, subname])
const onUpdateItem = async () => { const onUpdateItem = async () => {
let changedItem = {} as Item; let changedItem = {} as Item;
let offer_updates : Array<any> = []; let offer_updates: Array<any> = [];
//check for new offers //check for new offers
offers.map(o => { offers.map(o => {
const existingOffer = item?.offers?.find(t => t.tags_id === o.id) const existingOffer = item?.offers?.find(t => t.tags_id === o.id)
existingOffer && offer_updates.push(existingOffer.id) existingOffer && offer_updates.push(existingOffer.id)
if(!existingOffer && !tags.some(t => t.id === o.id)) addTag({...o,offer_or_need: true}) if (!existingOffer && !tags.some(t => t.id === o.id)) addTag({ ...o, offer_or_need: true })
!existingOffer && offer_updates.push({items_id: item?.id, tags_id: o.id}) !existingOffer && offer_updates.push({ items_id: item?.id, tags_id: o.id })
}); });
let needs_updates : Array<any> = []; let needs_updates: Array<any> = [];
needs.map(n => { needs.map(n => {
const existingNeed = user?.needs.find(t => t.tags_id === n.id) const existingNeed = user?.needs.find(t => t.tags_id === n.id)
existingNeed && needs_updates.push(existingNeed.id) existingNeed && needs_updates.push(existingNeed.id)
!existingNeed && needs_updates.push({items_id: item?.id, tags_id: n.id}) !existingNeed && needs_updates.push({ items_id: item?.id, tags_id: n.id })
!existingNeed && !tags.some(t => t.id === n.id) && addTag({...n,offer_or_need: true}) !existingNeed && !tags.some(t => t.id === n.id) && addTag({ ...n, offer_or_need: true })
}); });
changedItem = { id: id, name: name, subname: subname, text: text, color: color, position: item.position, ...image.length > 10 && { image: image }, ... offers.length > 0 && {offers: offer_updates}, ... needs.length > 0 && {needs: needs_updates} };
changedItem = { id: id, name: name, subname: subname, text: text, color: color, position: item.position, ...image.length > 10 && { image: image }, ...offers.length > 0 && { offers: offer_updates }, ...needs.length > 0 && { needs: needs_updates } };
// update profile item in current state // update profile item in current state
let offers_state : Array<any> = []; let offers_state: Array<any> = [];
let needs_state : Array<any> = []; let needs_state: Array<any> = [];
await offers.map(o => { await offers.map(o => {
offers_state.push({items_id: item?.id, tags_id: o.id}) offers_state.push({ items_id: item?.id, tags_id: o.id })
}); });
await needs.map(n => { await needs.map(n => {
needs_state.push({items_id: item?.id, tags_id: n.id}) needs_state.push({ items_id: item?.id, tags_id: n.id })
}); });
changedItem = {... changedItem, offers: offers_state, needs: needs_state}; changedItem = { ...changedItem, offers: offers_state, needs: needs_state };
text.toLocaleLowerCase().match(hashTagRegex)?.map(tag => { text.toLocaleLowerCase().match(hashTagRegex)?.map(tag => {
@ -165,7 +164,7 @@ export function OverlayItemProfileSettings() {
console.log(item.layer); console.log(item.layer);
if (item.layer) { if (!item.new) {
item?.layer?.api?.updateItem && toast.promise( item?.layer?.api?.updateItem && toast.promise(
item?.layer?.api?.updateItem(changedItem), item?.layer?.api?.updateItem(changedItem),
{ {
@ -185,9 +184,8 @@ export function OverlayItemProfileSettings() {
} }
else { else {
const layer = layers.find(l => l.itemType.name == "user") item.layer?.api?.createItem && toast.promise(
layer?.api?.createItem && toast.promise( item.layer?.api?.createItem(changedItem),
layer?.api?.createItem(changedItem),
{ {
pending: 'updating Item ...', pending: 'updating Item ...',
success: 'Item updated', success: 'Item updated',
@ -197,7 +195,7 @@ export function OverlayItemProfileSettings() {
}, },
}, },
}) })
.then(() => item && addItem({ ...item, ...changedItem, layer: layer, user_created: user, type: layer.itemType })) .then(() => item && addItem({ ...item, ...changedItem, layer: item.layer, user_created: user, type: item.layer?.itemType }))
.then(() => { .then(() => {
setLoading(false); setLoading(false);
navigate("/") navigate("/")