Redesign right sidebar top area

[JammingBen]

Initial Checklist

• I understand this is a user story and questions should be posted in the Community Discussions
• I searched issues and couldn’t find anything (or linked relevant results below)

User Story

As a user, I want my OpenCloud UI to have a nice and modern look & feel so that I have an easy time using it.

User Value

UI/UX

Acceptance Criteria

• the top area of the right sidebar in the files app and the admin settings should visually match the screenshots below

  • the root panel only shows a close button on the right
  • sub panels also show the back button next to the close button
  • the resource name truncates when it's too long

• for files, folders and spaces:

  • a small file type icon is showing in front of the name

• try out: to add panel name to each panel (except for shares and file details, they have separate stories)

Technical note: we currently have a sidebar header with the panel name and the close/back button and a FileInfo component for the resource name. They basically get merged into one now.