Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Cleanup] Adjusting Company Switcher Per New Design #2330

Merged
Merged
Show file tree
Hide file tree
Changes from 9 commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
56fbd27
Adjusting company switcher with new design
Civolilah Jan 26, 2025
6cdb11b
Implemented new design for company switcher
Civolilah Jan 28, 2025
ab1e615
Implemented hiding full sidebar
Civolilah Jan 28, 2025
c9d5029
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Jan 28, 2025
f3161c4
Added icons for mini sidebar
Civolilah Jan 29, 2025
4d5c084
Changed border color
Civolilah Jan 29, 2025
0f04cbd
Cleanup
Civolilah Jan 29, 2025
89027df
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Jan 29, 2025
f0ef346
Adjusted solution
Civolilah Jan 30, 2025
7897c25
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Jan 30, 2025
7f2f9c3
Changed position of icons
Civolilah Jan 31, 2025
48dbed3
Increased text size in company avatar
Civolilah Jan 31, 2025
428ea65
Cleanup
Civolilah Jan 31, 2025
1547f30
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 5, 2025
93bd5fe
Changed size of icons
Civolilah Feb 5, 2025
9bb2de5
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 6, 2025
e178ed5
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 10, 2025
99e4b5f
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 11, 2025
c6aaf87
Fixed issue with covering logo
Civolilah Feb 11, 2025
9d2515b
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 12, 2025
9b40954
Cleanup with object covering
Civolilah Feb 12, 2025
dd73bfb
Merge branch 'develop' into cleanup/1842-company-switcher
Civolilah Feb 13, 2025
fbd2306
Changed fallback logo
Civolilah Feb 14, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
70 changes: 70 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
"pusher-js": "^8.4.0-rc2",
"randexp": "^0.5.3",
"react": "^18.2.0",
"react-avatar": "^5.0.3",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We definitely need to kick out this library. It wasn't updated in years and it will definitely block our path to React 19.

As replacement we can use ui-avatars.com, but we should be careful here as well.

@turbo124 should we use 3rd party website to generate nice avatars for us (due to privacy concerns).

Just to be clear react-avatar isn't fully offline either.

"react-colorful": "^5.6.1",
"react-date-range": "^1.4.0",
"react-datepicker": "^4.11.0",
Expand Down
37 changes: 37 additions & 0 deletions src/common/hooks/useHandleCollapseExpandSidebar.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
/**
* Invoice Ninja (https://invoiceninja.com).
*
* @link https://github.com/invoiceninja/invoiceninja source repository
*
* @copyright Copyright (c) 2022. Invoice Ninja LLC (https://invoiceninja.com)
*
* @license https://www.elastic.co/licensing/elastic-license
*/

import { useUpdateCompanyUser } from '$app/pages/settings/user/common/hooks/useUpdateCompanyUser';
import { cloneDeep, set } from 'lodash';
import { useHandleCurrentUserChangeProperty } from './useHandleCurrentUserChange';
import { useInjectUserChanges } from './useInjectUserChanges';

export function useHandleCollapseExpandSidebar() {
const userChanges = useInjectUserChanges();

const updateCompanyUser = useUpdateCompanyUser();
const handleUserChange = useHandleCurrentUserChangeProperty();

return (value: boolean) => {
handleUserChange('company_user.react_settings.show_mini_sidebar', value);

if (userChanges) {
const updatedUserChanges = cloneDeep(userChanges);

set(
updatedUserChanges,
'company_user.react_settings.show_mini_sidebar',
value
);

updateCompanyUser(updatedUserChanges);
}
};
}
2 changes: 1 addition & 1 deletion src/common/hooks/useInjectUserChanges.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export function useInjectUserChanges(options?: Options) {
const changes = useUserChanges();

useEffect(() => {
if (changes && options?.overwrite === false) {
Copy link
Collaborator Author

@Civolilah Civolilah Jan 30, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@beganovich I don't think this ever worked correctly. David reported that the speed of collapsing/expanding sidebar is really slow - the reason for that is exactly this logic. The changes object is constantly being injected again because this if statement is almost never true.

By default, the changes object used in this if statement is an empty object ({}), it is never null/undefined. So, that part of the condition is always true, while the second part is equal to false only if the overwrite is passed through options. So, instead of comparing types also, we just want to check if the overwrite is set to true.

The overwrite is never passed as a true value, but also I don't think we ever need to overwrite changes over the changes we currently have.

The same thing applies to useInjectCompanyChange - the overwrite never passes the check that is false.

if (Object.keys(changes || {}).length && !options?.overwrite) {
// We don't want to overwrite existing changes,
// so let's just not inject anything if we already have a value,
// and relative argument.
Expand Down
Loading
Loading