Hello, messy designers, it's time to tidy up our components... we've got a working document that we've generated a lot of main components for... we've even started using them in other documents, so it's a big mess... every time somebody wants to update one of these... they have to go back to this working document... that's connected to other documents...

we just want to grab all of our components... and move them to a centralized file... and refactor, or relink all of those components... to any document that might be using them... so we can detach this messy old working document... and have one source of truth, all right, let's get some components in.

So I've got a component, it's a main component, I can tell by the icon here... it is, started life in this working document... I've published it, I've used it in this mobile app design here... but I need to move it to a tidier file... I'm calling this one "Main Styles & Components"... so I've got a more centralized design system...

that other people can use and not linking back to this first work document. So the easy one is, you select it... make sure you got the main component not the instance, and you cut it... you can't use copy, so 'Edit', 'Cut', or 'Command X', 'Ctrl X' on a PC... I'm going to move it across here, and it's going to kind of work... so it's going to work, it's going to say...

"Hey, you've moved this over, would you like to publish it?"  If this doesn't appear it means that this document here... this design file that you're using as your main styles is not in a team library... so it can't be in Drafts for this to work. The other thing that might hold it up is that... components can only be published from a paid account... so if you've got a free account, even though it's in a team library...

it still might not work... they do change this, they go through and change their pricing model... and what can be done at different levels, so it's not a hard and fast rule... it might be the reason you're not seeing this published down the bottom here. So I'm going to publish it... I'm going to move this file, there's a warning, have a read, let's publish...

and we're going to kind of work, let's have a look at my mobile app now... and here, I'm going to review any changes... and for me it is just a move, so it's move from Event app... let's update it, happy days... has anything changed? Let's have a look, so I'm going to select on it...

I'm going to go to here, to edit my main component... and it's jumping to this file, which is perfect, so it mostly works. One thing that's going to catch me out is that this particular thing... actually has embedded inside of it nested components... or at least, nested instances of those components... so the main component, great, that is this...

but if I look inside there is this, look at that... there is that heart, there is the Pricing, which is this bottom piece... all sorts of stuff need to come back... now watch this, if I right click this and say, 'Go to Main Component'... it's going to go back to this first file. So you just got to be sure, when you cut things out and move it across...

you're grabbing everything... and in my case I need Price, I need the Lower Card... I need the icons that are being used... let me show you how to work all that out. The other thing to note, separate from that... is that, like we do with the styles...

when you cut something and move it across here... this file says, it needed to be reviewed because it was using an instance of it... but the original file says, "Hey, I've changed, I need to be reviewed"... and this is moved from this document over to this other one... just need to update it, and now we're all happy, there you go. To do this properly though, instead of just copying across the main component...

we need to bring in all the instances that are embedded into it... there was an option earlier on where we went, 'Properties'... and we could see all the nested instances... expose them, it only exposes the ones that have options, like large, small... it doesn't have the instances of say this icon here... even though it definitely is, it's one of my icons.

So the other way to do it is to... actually unpack all of this and just see what's going on... actually, the easiest way is to go back to this original... go to your 'Assets' panel, open up 'Local Components'... and then go through every single page, just cut and paste all of them across... then everything comes across...

if we want to be a bit more surgical... what we can do is... I want to open up all of these to see where there might be instances lurking... who remembers the shortcut to kind of like open all of these up, do you remember? That's right, you hold down the 'Option' key on a Mac, 'Alt' key on PC... and then it should all untwirl...

and you can see, there's one instance, there's another one... there's another one, there's another one... so I can go and pick these up and cut and paste them across. You can save time if you're unorganized and all over the place like me... you can right click them and say, 'Go to Main Component', there it is... let's go to 'Cut'...

let's go to 'Paste', let's not put them on top of each other... and make sure that this is published... and this one is reviewed and published as well... and then go through and say, "Actually, I need you, I need you"... anything else I need? I think that's it, oh, I need all the icons as well...

cut them, did I get everything? I think I did, paste them over here... and going to start building out this page with some sections, like we did before... but you get the idea. So let's do it, let's publish it, let's finish it off, one last thing at the end... let's review this one, update all, these moved.

The last thing is that you might not want this file published as a team file... it might just be a working file for you... once you've cut and paste everything out you can unpublish it... so remember, 'Option 3', 'Alt 3' on a PC... not sure what I did to that, but I did something... I'm going to go back into there, and now I can say...

you are going to be 'Unpublished'... I'm going to leave mine open, but that's what you might want to do. All right, so that is how you tidy up your working documents... get everything into a centralized design file... all right, that's it, I'll see you in the next video.