implemented open hub feature

optimized fxml files and img

src/main/java/org/cryptomator/ui/sharevault/ShareVaultController.java

@@ -9,28 +9,36 @@ import javax.inject.Inject;
 import javafx.application.Application;
 import javafx.fxml.FXML;
 import javafx.stage.Stage;
+import java.io.IOException;
+import java.io.UncheckedIOException;
+import java.net.URI;
+import java.net.URISyntaxException;
 
 @ShareVaultScoped
 public class ShareVaultController implements FxController {
+
+	private static final String SCHEME_PREFIX = "hub+";
 	private static final String VISIT_HUB_URL = "https://cryptomator.org/hub/";
-	private static final String OPEN_HUB_URL = "https://cryptomator.org/hub/";
+	private static final String BEST_PRACTICES_URL = "https://docs.cryptomator.org/en/latest/security/best-practices/#sharing-of-vaults";
 
 	private final Stage window;
 	private final Lazy<Application> application;
+	private final Vault vault;
 	private final Boolean hubVault;
 
 	@Inject
 	ShareVaultController(@ShareVaultWindow Stage window, //
 						 Lazy<Application> application, //
-						 @ShareVaultWindow Vault vault){
+						 @ShareVaultWindow Vault vault) {
 		this.window = window;
 		this.application = application;
+		this.vault = vault;
 		var vaultScheme = vault.getVaultConfigCache().getUnchecked().getKeyId().getScheme();
 		this.hubVault = (vaultScheme.equals(HubKeyLoadingStrategy.SCHEME_HUB_HTTP) || vaultScheme.equals(HubKeyLoadingStrategy.SCHEME_HUB_HTTPS));
 	}
 
 	@FXML
-	public void close(){
+	public void close() {
 		window.close();
 	}
 
@@ -38,9 +46,27 @@ public class ShareVaultController implements FxController {
 	public void visitHub() {
 		application.get().getHostServices().showDocument(VISIT_HUB_URL);
 	}
+
 	@FXML
 	public void openHub() {
-		application.get().getHostServices().showDocument(OPEN_HUB_URL);
+		application.get().getHostServices().showDocument(getHubUri(vault).toString());
+	}
+
+	@FXML
+	public void visitBestPractices() {
+		application.get().getHostServices().showDocument(BEST_PRACTICES_URL);
+	}
+
+	private static URI getHubUri(Vault vault) {
+		try {
+			var keyID = new URI(vault.getVaultConfigCache().get().getKeyId().toString());
+			assert keyID.getScheme().startsWith(SCHEME_PREFIX);
+			return new URI(keyID.getScheme().substring(SCHEME_PREFIX.length()) + "://" + keyID.getHost() + "/app/vaults");
+		} catch (IOException e) {
+			throw new UncheckedIOException(e);
+		} catch (URISyntaxException e) {
+			throw new IllegalStateException("URI constructed from params known to be valid", e);
+		}
 	}
 
 	public boolean isHubVault() {

src/main/resources/fxml/share_vault.fxml

@@ -12,20 +12,27 @@
 <?import org.cryptomator.ui.controls.FontAwesome5IconView?>
 <?import javafx.scene.image.ImageView?>
 <?import javafx.scene.image.Image?>
-<VBox xmlns:fx="http://javafx.com/fxml"
+<?import javafx.scene.control.Hyperlink?>
+<?import javafx.scene.control.Tooltip?>
+<?import javafx.scene.Group?>
+<HBox xmlns:fx="http://javafx.com/fxml"
 	  xmlns="http://javafx.com/javafx"
 	  fx:controller="org.cryptomator.ui.sharevault.ShareVaultController"
 	  prefWidth="600"
-	  spacing="12"
-	  alignment="CENTER_LEFT">
+	  spacing="12">
 	<padding>
-		<Insets topRightBottomLeft="24"/>
+		<Insets topRightBottomLeft="12"/>
 	</padding>
-	<HBox spacing="12" VBox.vgrow="NEVER">
-		<StackPane HBox.hgrow="NEVER">
+	<Group>
+		<StackPane>
+			<padding>
+				<Insets topRightBottomLeft="6"/>
+			</padding>
 			<Circle styleClass="glyph-icon-primary" radius="24"/>
 			<FontAwesome5IconView styleClass="glyph-icon-white" glyph="INFO" glyphSize="24"/>
 		</StackPane>
+	</Group>
+	<VBox>
 		<VBox spacing="6" HBox.hgrow="ALWAYS" visible="${controller.hubVault}" managed="${controller.hubVault}">
 			<Label text="%shareVault.hub.message" styleClass="label-extra-large" wrapText="true"/>
 			<Label text="%shareVault.hub.instruction.0" wrapText="true"/>
@@ -35,9 +42,18 @@
 		<VBox spacing="12" HBox.hgrow="ALWAYS" visible="${!controller.hubVault}" managed="${!controller.hubVault}">
 			<Label text="%shareVault.message" styleClass="label-extra-large" wrapText="true"/>
 			<Label text="%shareVault.description" wrapText="true"/>
-			<Label text="%shareVault.instruction.0" wrapText="true"/>
-			<Label text="%shareVault.instruction.1" wrapText="true"/>
-			<Label text="%shareVault.more" wrapText="true"/>
+			<Label text="%shareVault.instruction" wrapText="true"/>
+			<HBox HBox.hgrow="ALWAYS" spacing="6">
+				<Label text="%shareVault.more" wrapText="true" VBox.vgrow="ALWAYS"/>
+				<Hyperlink contentDisplay="GRAPHIC_ONLY" onAction="#visitBestPractices">
+					<graphic>
+						<FontAwesome5IconView glyph="QUESTION_CIRCLE" styleClass="glyph-icon-muted"/>
+					</graphic>
+					<tooltip>
+						<Tooltip text="%shareVault.docsTooltip" showDelay="100ms"/>
+					</tooltip>
+				</Hyperlink>
+			</HBox>
 			<HBox spacing="6" style="-fx-padding: 10px; -fx-background-color: white; -fx-border-color: #dddddd; -fx-border-width: 2px; -fx-border-radius: 5px;">
 				<VBox spacing="6" alignment="CENTER_LEFT">
 					<Label text="%shareVault.info.1" style="-fx-font-weight: bold;" wrapText="true"/>
@@ -48,17 +64,17 @@
 				</VBox>
 				<Region HBox.hgrow="ALWAYS"/>
 				<ImageView HBox.hgrow="ALWAYS" fitWidth="200" preserveRatio="true" cache="true">
-					<Image url="@../img/share-hub-logo.png"/>
+					<Image url="@../img/group-magic.png"/>
 				</ImageView>
 			</HBox>
 		</VBox>
-	</HBox>
-	<Region VBox.vgrow="ALWAYS"/>
-	<ButtonBar buttonMinWidth="120" buttonOrder="+CX">
-		<buttons>
-			<Button text="%generic.button.close" ButtonBar.buttonData="CANCEL_CLOSE" onAction="#close"/>
-			<Button text="%shareVault.hub.openHub" ButtonBar.buttonData="NEXT_FORWARD" defaultButton="true" onAction="#openHub" visible="${controller.hubVault}" managed="${controller.hubVault}"/>
-			<Button text="%shareVault.visitHub" ButtonBar.buttonData="NEXT_FORWARD" defaultButton="true" onAction="#visitHub" visible="${!controller.hubVault}" managed="${!controller.hubVault}"/>
-		</buttons>
-	</ButtonBar>
-</VBox>
+		<Region VBox.vgrow="ALWAYS" minHeight="18"/>
+		<ButtonBar buttonMinWidth="120" buttonOrder="+CX">
+			<buttons>
+				<Button text="%generic.button.close" ButtonBar.buttonData="CANCEL_CLOSE" onAction="#close"/>
+				<Button text="%shareVault.hub.openHub" ButtonBar.buttonData="NEXT_FORWARD" defaultButton="true" onAction="#openHub" visible="${controller.hubVault}" managed="${controller.hubVault}"/>
+				<Button text="%shareVault.visitHub" ButtonBar.buttonData="NEXT_FORWARD" defaultButton="true" onAction="#visitHub" visible="${!controller.hubVault}" managed="${!controller.hubVault}"/>
+			</buttons>
+		</ButtonBar>
+	</VBox>
+</HBox>

src/main/resources/fxml/vault_detail_locked.fxml

@@ -24,19 +24,17 @@
 				<FontAwesome5IconView glyph="KEY" glyphSize="15"/>
 			</graphic>
 		</Button>
+		<Hyperlink text="%main.vaultDetail.passwordSavedInKeychain" visible="${controller.passwordSaved}" managed="${controller.passwordSaved}" onAction="#showKeyVaultOptions">
+			<graphic>
+				<FontAwesome5IconView glyph="LOCK"/>
+			</graphic>
+		</Hyperlink>
 		<Button text="%main.vaultDetail.share" minWidth="120" onAction="#share">
 			<graphic>
 				<FontAwesome5IconView glyph="SHARE" glyphSize="15"/>
 			</graphic>
 		</Button>
-		<Hyperlink text="%main.vaultDetail.passwordSavedInKeychain" visible="${controller.passwordSaved}" onAction="#showKeyVaultOptions">
-			<graphic>
-				<FontAwesome5IconView glyph="LOCK"/>
-			</graphic>
-		</Hyperlink>
-
 		<Region VBox.vgrow="ALWAYS"/>
-
 		<HBox alignment="BOTTOM_RIGHT">
 			<Button text="%main.vaultDetail.optionsBtn" minWidth="120" onAction="#showVaultOptions">
 				<graphic>

src/main/resources/i18n/strings.properties

@@ -531,14 +531,14 @@ updateReminder.yesAutomatically=Yes, Automatically
 shareVault.title=Share Vault
 shareVault.message=Would you like to share your vault with others?
 shareVault.description=Always be careful when sharing your vault with other people. In short, follow these steps:
-shareVault.instruction.0=To encrypt files, follow these steps:
-shareVault.instruction.1=1. Share access of the encrypted vault folder via cloud storage.\n2. Share vault password in a secure way.
+shareVault.instruction=1. Share access of the encrypted vault folder via cloud storage.\n2. Share vault password in a secure way.
 shareVault.more=For more information, check out our best practices.
+shareVault.docsTooltip=Open the documentation to learn more about sharing of vaults.
 shareVault.info.1=The secure way to work in teams
 shareVault.info.2=Use Cryptomator Hub!
 shareVault.info.3=• Zero-knowledge key management
 shareVault.info.4=• Strong authentication
-shareVault.info.5=• ...
+shareVault.info.5=• End-to-End Encryption
 shareVault.visitHub=Visit Cryptomator Hub
 
 shareVault.hub.message=How to share a Hub vault